/* colours */

  /*____________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________*/
  /* Reset default body margin and overflow */
  body, html {
    margin: 0; /* Remove default margins */
    padding: 0; /* Remove default padding */
    height: 100%; /* Ensures the body covers the full height of the viewport */
    overflow: auto; /* Prevents scrolling */

    /* Added at time of timepicker */
    justify-content: center;
    align-items: center;

    padding-top: 26px; /* Adjust this value to match the height of the navbar */
  }
  
  /* Main content container */
  main {
    /* height: calc(100% - 100px); Adjusts height to leave space for the nav bar */
    overflow: auto; /* If needed, content inside the main area can scroll */
  }
  /*____________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________*/
  
  /* NAVIGATION TOP*/
  /* layout styles */
  nav {
    background: #FFE9D2; /* Or use grey lighten-4 if desired */
    /* border-bottom: 1px solid lightgray; */
    /* border-bottom: 10px solid var(--secondary); */
    height: auto;
    color: black;
    
  }
  #top-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10; /* Ensure it stays above other content */
  }
  .nav-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top: 5vw;
    margin-top: 0px;
    margin-right: 5vw;
    margin-bottom: 0px;
    margin-left: 5vw;
  }

  nav a {
    line-height: 20px;
    margin-top: 5vw;

  }
  nav a span {    /* JUST THE ARROW AND NAME 'RAGHAV' */
    color: #004978;
    font-size: 1.3rem; /*Arrow icon's font size is specified separately in HTML*/
    font-weight: 600; 
    text-transform: uppercase;
  }
  p {    /*the phone number and email id line*/
    color: rgba(2, 6, 12, .6);
    font-size: .93rem;
    line-height: 1.3;
    font-family: Gilroy, arial, Helvetica Neue, sans-serif;
    font-weight: 500;
    letter-spacing: 0;
    margin-block-start: 3vw;
    white-space: normal; /* Allows text to wrap to the next line */
    word-wrap: break-word; /* Breaks long words if they exceed the container's width */
    overflow-wrap: break-word; /* Modern alternative to word-wrap */
    max-width: 100%; /* Ensures the text doesn't overflow the container */
  }
  nav .icon-container .material-symbols-outlined {   /*Just the arrow !!!*/
    line-height: 1;
    cursor: pointer; /* Add cursor pointer for better user experience */
    font-variation-settings: 'FILL' 1, 'wght' 700, 'GRAD' 0, 'opsz' 48; /*Size of the notification and settings icon*/
  }
    

  .hidden {
    display: none;
  }
  /*____________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________*/