/* Base styles */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    user-select: none;
}

body {
    background-color: #115139;
    padding-bottom: 100px;
    margin: 0;
    transition-duration: 0.2s;
    overflow-y: scroll; /* Ensure scrollbar is always present to prevent layout shifts */
}

h4 {
    margin: 0;
    font-size: 0.938rem;
    text-align: center;
}

hr {
    border: solid 1px #A9A9A9;
    margin: 0;
}

/* Base link styles - consider adjusting colors for better contrast on dark backgrounds */
a:link, a:visited {
    color: #a7d7c5; /* Lighter green/teal for visibility */
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: #f0e68c; /* Khaki/Light Yellow for hover */
    text-decoration: underline;
}

/* Container layout */
.container_page {
    position: relative;
    width: 100%;
    min-height: 100vh;
}

/* Logo and header */
.logohead {
    position: absolute;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 100%;
    z-index: 2; /* Below menus/modals */
}

.logo {
    position: relative;
    top: -0.75rem;
    filter: drop-shadow(2px 2px 2px #000000);
    scale: 90%;
}

.head {
    position: relative;
    top: -2.5rem;
    font-size: 2.25rem;
    font-weight: 700;
    color: white;
    text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

/* ======================================== */
/* Mask & Layering Styles (Merged/Updated) */
/* ======================================== */

/* Mask Styling (Overlay) - UPDATED Z-INDEX */
#mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Semi-transparent black */
    /* --- Z-INDEX: BELOW dropdowns and modal --- */
    z-index: 998; /* << CHANGED: Lower than dropdowns (1000) */
    /* Initially hidden */
    display: none; /* Controlled by JS (fadeIn/fadeOut) */
    opacity: 0; /* Start fully transparent */
    transition: opacity 0.3s ease-in-out; /* Smooth fade */
}

/* --- Z-Index Definitions --- */

/* Dropdown Menus (User Menu, Main Menu, Submenus, Preferences) - Keep Z-INDEX */
.user-dropdown,
.menu-dropdown,
.submenu-dropdown,
#preferences-container {
    position: fixed; /* Or absolute, adjust as needed */
    z-index: 1000;   /* Base level for dropdowns */
    display: none;   /* Initially hidden */
    /* Keep existing styles from user file below */
    width: 250px;
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
/* Specific positioning from user file */
.user-dropdown, #preferences-container {
    top: 3rem; /* Base position */
    right: 0.625rem;
}
#preferences-container {
    top: 6.5rem; /* Adjusted position for preferences */
}
.menu-dropdown {
    top: 3rem;
    right: 3.5rem; /* Position near list icon */
}
/* Fix the menu dropdown CSS class */
#menu-dropdown {
    position: fixed;
    z-index: 1000;
    display: none;
    width: 250px;
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    top: 3rem;
    right: 3.5rem;
}
.submenu-dropdown {
    position: fixed !important; /* Important to override other styles */
    top: 3rem !important;
    right: 3.5rem !important;
    left: auto !important; /* Ensure no left positioning */
    width: 250px;
    margin: 0 !important; /* Ensure no margin */
	transform: none !important;
    -webkit-transform: none !important;
}
/* Login Modal - Keep Z-INDEX */
.modal#login-modal { /* Specific selector */
    position: fixed;
    z-index: 1010;   /* Higher than mask and dropdowns */
    display: none;   /* Initially hidden */
    /* Keep existing styles from user file below */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%; /* Responsive width */
    max-width: 400px; /* Max width */
}

/* Login Modal Content Area - Keep Z-INDEX */
.modal-content {
     position: relative; /* Establishes stacking context */
     z-index: 1011; /* Ensure content is above modal background */
     /* Keep existing styles from user file below */
     background-color: rgba(0, 0, 0, 0.85); /* Dark background */
     backdrop-filter: blur(5px); /* Blur effect */
     padding: 25px 30px;
     border-radius: 8px; /* Rounded corners */
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); /* Shadow */
     color: #e0e0e0; /* Light text color */
     border: 1px solid rgba(255, 255, 255, 0.1); /* Subtle border */
}

.info-message, .success-message, .error-message {
  padding: 5px;
  border-radius: 4px;
}
.info-message {
  color: #0288d1;
  background-color: rgba(33, 150, 243, 0.1);
  border: 1px solid rgba(33, 150, 243, 0.2);
}
.success-message {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
  border: 1px solid rgba(76, 175, 80, 0.2);
}
.error-message {
  color: #f44336;
  background-color: rgba(244, 67, 54, 0.1);
  border: 1px solid rgba(244, 67, 54, 0.2);
}

/* Login modal toggle mode */
.login-form-container.reset-mode .password-field-group {
  display: none;
}

.login-form-container.reset-mode .password-field-group { display: none; }

/* Password reset page */
.reset-password-container {
	position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%; /* Responsive width */
    max-width: 400px; /* Max width */
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
  border-radius: 8px;
  color: #e0e0e0;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.reset-form-card {
  padding: 20px;
}

.reset-message {
  margin: 15px 0;
  min-height: 1.2em;
}

.info-message {
  color: #0288d1;
  padding: 5px;
  background-color: rgba(33, 150, 243, 0.1);
  border: 1px solid rgba(33, 150, 243, 0.2);
  border-radius: 4px;
}

.success-message {
  color: #4CAF50;
  padding: 5px;
  background-color: rgba(76, 175, 80, 0.1);
  border: 1px solid rgba(76, 175, 80, 0.2);
  border-radius: 4px;
}

.error-message {
  color: #f44336;
  padding: 5px;
  background-color: rgba(244, 67, 54, 0.1);
  border: 1px solid rgba(244, 67, 54, 0.2);
  border-radius: 4px;
}

/* Auth context related styles */
.auth-context-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100px;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 5px;
  margin: 1rem auto;
  max-width: 400px;
}

.login-form-container {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.login-form-container.reset-mode .password-field-group {
  display: none;
}

.login-form-container.reset-mode h2 {
  animation: pulse 1s ease-in-out;
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* React Notifications - adapted from existing notification styles */
.notification-wrapper {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2000;
  transition: all 0.3s ease;
  pointer-events: none; /* Allow clicks to pass through */
}

/* User Navbar React Component - integrates with existing styles */
.user-auth-section {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.user-info-display {
  font-size: 0.9rem;
  color: #fff;
  text-shadow: -0.0625rem 0 #000, 0 0.0625rem #000, 0.0625rem 0 #000, 0 -0.0625rem #000;
  max-width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.auth-button {
  background: #115139;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 10px 16px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease;
  text-align: center;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

.auth-button:hover {
  background: #19664a;
}

.auth-button:disabled {
  background-color: #555;
  cursor: not-allowed;
  opacity: 0.7;
}

.auth-button.secondary {
  background-color: #7B3F00;
}

.auth-button.secondary:hover {
  background-color: #9B5F20;
}

/* Protected route page styles */
.unauthorized-page {
  max-width: 600px;
  margin: 6rem auto 0;
  padding: 2rem;
  background-color: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(5px);
  color: white;
  border-radius: 8px;
  text-align: center;
}

.unauthorized-page h2 {
  color: #f44336;
  margin-bottom: 1rem;
}

.unauthorized-page p {
  margin-bottom: 1.5rem;
}

/* Role badge for display in user dropdown */
.role-badge {
  display: inline-block;
  font-size: 0.7rem;
  padding: 2px 6px;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 10px;
  margin-left: 5px;
  color: white;
}

.role-badge.admin {
  background-color: rgba(244, 67, 54, 0.7);
}

.role-badge.provider {
  background-color: rgba(33, 150, 243, 0.7);
}

.role-badge.staff {
  background-color: rgba(76, 175, 80, 0.7);
}

/* React specific modal adjustments to ensure compatibility */
.modal.react-modal {
  align-items: center;
  justify-content: center;
}

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 998;
}

/* Auth Form Fields - Consistent with existing form styling */
.auth-form-field {
  margin-bottom: 15px;
}

.auth-form-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.9rem;
  color: #bbb;
  font-weight: 500;
}

.auth-form-field input {
  width: 100%;
  padding: 10px 12px;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 5px;
  color: #fff;
  font-size: 1rem;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.auth-form-field input::placeholder {
  color: #888;
}

.auth-form-field input:focus {
  outline: none;
  border-color: #19664a;
  background-color: rgba(255, 255, 255, 0.15);
}

/* Message styling for auth components */
.auth-message {
  margin-top: 15px;
  padding: 10px;
  border-radius: 4px;
  text-align: center;
  transition: all 0.3s ease;
}

.auth-message.success {
  background-color: rgba(76, 175, 80, 0.15);
  color: #4CAF50;
  border: 1px solid rgba(76, 175, 80, 0.3);
}

.auth-message.error {
  background-color: rgba(244, 67, 54, 0.15);
  color: #f44336;
  border: 1px solid rgba(244, 67, 54, 0.3);
}

.auth-message.info {
  background-color: rgba(33, 150, 243, 0.15);
  color: #2196F3;
  border: 1px solid rgba(33, 150, 243, 0.3);
}

/* Fade animations for React components */
.fade-enter {
  opacity: 0;
  transform: translateY(10px);
}

.fade-enter-active {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 300ms, transform 300ms;
}

.fade-exit {
  opacity: 1;
  transform: translateY(0);
}

.fade-exit-active {
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 300ms, transform 300ms;
}
/* ======================================== */
/* Menu & Dropdown Styles (From User File)*/
/* ======================================== */

/* Menu Icon */
.fa-list {
  position: fixed;
  top: 0.625rem;
  right: 3.5rem;
  font-size: 1.875rem;
  color: #fff;
  opacity: 0.5;
  z-index: 5; /* Note: Lower than dropdowns/mask */
  text-shadow: -0.0625rem 0 #000, 0 0.0625rem #000, 0.0625rem 0 #000, 0 -0.0625rem #000;
  cursor: pointer;
}
.fa-list:hover, .fa-list.active { opacity: 1; }

/* User Icon */
#user-icon {
  position: fixed;
  top: 0.625rem;
  right: 0.625rem;
  font-size: 1.875rem;
  color: #fff;
  opacity: 0.5;
  z-index: 5; /* Note: Lower than dropdowns/mask */
  cursor: pointer;
  text-shadow: -0.0625rem 0 #000, 0 0.0625rem #000, 0.0625rem 0 #000, 0 -0.0625rem #000;
}
#user-icon:hover, #user-icon.active { opacity: 1; }


/* Menu dropdown items */
.menu-dropdown-item {
  padding: 12px 15px; color: white; cursor: pointer; transition: background-color 0.3s ease;
  display: flex; align-items: center; justify-content: space-between;
}
.menu-dropdown-item:hover { background-color: rgba(255, 255, 255, 0.1); }
.menu-dropdown-item i:first-child { margin-right: 15px; width: 20px; text-align: center; }
.submenu-arrow { margin-left: auto; font-size: 0.8rem; }

/* Submenu dropdown styles */
/* Base styles already defined above with z-index */
.submenu-header {
  display: flex; align-items: center; padding: 12px 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: white; font-weight: bold;
}
/* Combined .submenu-back styles */
.submenu-back {
  margin-right: 15px; cursor: pointer; display: flex; align-items: center;
  /* Styles previously duplicated */
  padding: 10px 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: white;
}
.submenu-back i { margin-right: 10px; }
.submenu-item { padding: 10px 15px 10px 25px; }
.submenu-item a { color: white; text-decoration: none; display: block; }
.submenu-item:hover { background-color: rgba(255, 255, 255, 0.1); }


/* User dropdown items */
.user-dropdown-header {
    padding: 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: white; font-weight: bold; font-size: 1.1rem;
}
.user-dropdown-item {
    padding: 12px 15px; color: white; cursor: pointer; transition: background-color 0.3s ease;
    display: flex; align-items: center;
}
.user-dropdown-item:hover { background-color: rgba(255, 255, 255, 0.1); }
.user-dropdown-item i { margin-right: 10px; width: 20px; text-align: center; font-size: 0.9rem; }

/* Preferences Container */
/* Base styles already defined above with z-index */
.preferences-header {
  display: flex; align-items: center; padding: 12px 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: white;
}
.preferences-back { margin-right: 15px; cursor: pointer; } /* Already styled like .submenu-back */
.settings-control {
  margin: 5px 0; display: flex; align-items: center; justify-content: center; padding: 0 15px;
}
.setting-toggle {
  background: transparent; color: white; border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 8px 12px; border-radius: 4px; font-size: 0.8rem; cursor: pointer;
  transition: all 0.2s; width: 100%; text-align: center;
}
.setting-toggle:hover { background: rgba(255, 255, 255, 0.1); }
.setting-toggle.active { background: rgba(76, 175, 80, 0.3); border-color: rgba(76, 175, 80, 0.5); }


/* ======================================== */
/* Login Modal Specific Element Styles (New/Updated) */
/* ======================================== */

.close-modal {
    position: absolute; top: 10px; right: 15px; font-size: 1.6rem;
    color: #aaa; cursor: pointer; transition: color 0.2s ease; line-height: 1;
}
.close-modal:hover { color: #fff; }

.modal-content h2 {
    margin-top: 0; margin-bottom: 20px; color: #fff; text-align: center;
    font-weight: 600; font-size: 1.5rem;
}

.form-group { margin-bottom: 18px; }

.form-group label {
    display: block; margin-bottom: 6px; font-size: 0.9rem; color: #bbb; font-weight: 500;
}

.form-group input[type="email"],
.form-group input[type="password"] {
    width: 100%; padding: 10px 12px; background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 5px; color: #fff;
    font-size: 1rem; box-sizing: border-box;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.form-group input[type="email"]::placeholder,
.form-group input[type="password"]::placeholder { color: #888; }

.form-group input[type="email"]:focus,
.form-group input[type="password"]:focus {
    outline: none; border-color: #19664a; background-color: rgba(255, 255, 255, 0.15);
}

.forgot-password { text-align: right; margin-top: -10px; margin-bottom: 20px; }

#forgot-password-link {
    color: #aaa; font-size: 0.85rem; text-decoration: none; transition: color 0.2s ease;
}
#forgot-password-link:hover { color: #fff; text-decoration: underline; }

.login-actions { margin-top: 25px; }

#login-button { /* Style like other main buttons */
    width: 100%; padding: 12px; background: #115139; color: white; border: none;
    border-radius: 5px; font-size: 1rem; font-weight: 600; cursor: pointer;
    transition: background-color 0.2s ease; text-align: center;
}
#login-button:hover { background: #19664a; }
#login-button:disabled { background-color: #555; cursor: not-allowed; opacity: 0.7; }

.login-message { margin-top: 15px; text-align: center; font-size: 0.9rem; min-height: 1.2em; }
.login-message .success-message { color: #4CAF50; } /* Green */
.login-message .error-message { color: #f44336; } /* Red */


/* ======================================== */
/* Other Styles (From User File)        */
/* ======================================== */

/* Search Type Tabs */
.search-tabs {
  position: absolute; top: 5.5rem; right: 32.5%; display: flex; flex-direction: row;
  justify-content: flex-end; gap: 5px; z-index: 4; width: auto;
}
.tab-item {
  display: inline-flex; justify-content: center; align-items: center; padding: 6px;
  border-radius: 6px; cursor: pointer; transition: all 0.2s ease;
  background-color: rgba(255, 255, 255, 0.1); backdrop-filter: blur(5px);
  border: 1px solid rgba(255, 255, 255, 0.2); width: auto;
}
.tab-item:hover { background-color: rgba(255, 255, 255, 0.2); transform: translateY(-2px); }
.tab-item.active {
  background-color: rgba(255, 255, 255, 0.25); border: 1px solid rgba(255, 255, 255, 0.4);
  transform: translateY(-3px); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.tab-item i { font-size: 1rem; }
.tab-item .tab-label { display: none; }
/* Tab icon colors */
.tab-item[data-search-type="medical"] i { color: #e53935; } /* Red */
.tab-item[data-search-type="dental"] i { color: #2196f3; } /* Blue */
.tab-item[data-search-type="behavioral"] i { color: #4caf50; } /* Green */
.tab-item[data-search-type="vision"] i { color: #ffd600; } /* Yellow */
.tab-item[data-search-type="pharmacy"] i { color: #ff9800; } /* Orange */
.tab-item[data-search-type="imaging"] i { color: #e91e63; } /* Pink */
.tab-item[data-search-type="labs"] i { color: #9c27b0; } /* Purple */

/* Add Provider Button */
#add-provider-button { background: #115139; color: white; transition: background-color 0.2s; }
#add-provider-button:hover { background: #19664a; color: white; }
/* Ensure add-entry-button class (if used) doesn't conflict */
.add-entry-button { background: #115139; color: white; transition: background-color 0.2s; }
.add-entry-button:hover { background: #19664a; color: white; }
.add-entry-button.nvihbutton:hover { background: #19664a !important; color: white !important; }


/* New provider form */
.new-entry-container {
  width: 90%; max-width: 62.5rem; margin: 0 auto 0.5rem auto; display: none;
  position: relative; z-index: 5; margin-top: 5rem;
}
.new-provider-form {
  background-color: #d3d3d3 !important; display: block !important; padding: 1rem !important;
  border-bottom: 1px solid #858585; border-radius: 5px 5px 0 0; transition: background-color 0.2s;
  position: relative; z-index: 5;
}
.new-provider-form:hover { background-color: #f0f0f0 !important; }
.provider-name-input, .specialty-input {
  font-size: 1rem;         /* Consistent font size */
  padding: 0.25rem 0.5rem; /* Consistent padding */
  border: 1px solid #ccc;  /* Same border */
  border-radius: 4px;      /* Same border radius */
  background-color: rgba(255, 255, 255, 0.5);
  height: 36px;            /* Explicit height to ensure consistency */
  box-sizing: border-box;  /* Include padding in height calculation */
}

/* Provider name can still be bold if desired */
.provider-name-input {
  font-weight: 600;
}
/* Add these styles to your CSS file */

/* Create a flex container for the provider name and specialty */
.provider-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.25rem;
  width: 100%;
}

/* Adjust provider name input width */
.provider-header-row .provider-name-input {
  width: 65%;
  margin-bottom: 0;
}

/* Adjust specialty input styling */
.provider-header-row .specialty-input {
  width: 30%;
  margin-bottom: 0;
  display: block;
}

/* Form validation error messaging */
.form-validation-error {
  background-color: #ffecec;
  color: #d8000c;
  border: 1px solid #d8000c;
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 15px;
  font-size: 0.9rem;
}

.form-validation-error ul {
  margin-top: 5px;
  margin-bottom: 0;
  padding-left: 20px;
}

.form-validation-error li {
  margin-bottom: 3px;
}

.input-error {
  border-color: #d8000c !important;
  background-color: #fff8f8 !important;
}

/* Auth warning */
.auth-warning {
  background-color: #feefb3;
  color: #9f6000;
  border: 1px solid #9f6000;
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 15px;
  font-size: 0.9rem;
  text-align: center;
}
.tr_provinfo_text { margin: 0.5rem 0; line-height: 1.5; max-width: 70%; margin-top: -0.3125rem; } /* Used in form and results */
.inline-input {
  display: inline-block; padding: 0.15rem 0.3rem; margin: 0 0.1rem; border: 1px solid #ccc;
  border-radius: 3px; font-size: 0.85rem; background-color: rgba(255, 255, 255, 0.5); vertical-align: middle;
}
.small-input { width: 8rem; }
.medium-input { width: 10rem; }
.tiny-input { width: 3rem; }
.additional-form-fields { margin-top: 0.5rem; font-size: 0.8rem; }
.form-field-row { margin-bottom: 0.3rem; display: flex; align-items: center; flex-wrap: wrap; }
.form-field-row label { margin: 0 0.3rem 0 0.5rem; font-weight: 600; }
/* Check container positioning within form */
.new-provider-form .check_container {
  position: absolute; top: 5.625rem; right: 10rem; width: auto; margin-top: 0;
}
.check_container .small-checkbox { /* Checkbox styling within form */
  display: block; margin: 0 auto 0.3rem auto; width: 0.6rem; height: 0.6rem; cursor: pointer;
}
.check_container label { font-size: 0.7rem; font-weight: 500; line-height: 1.2; display: block; text-align: center; }
.notes-textarea {
  width: 100%; min-height: 80px; padding: 0.5rem; border: 1px solid #ccc;
  border-radius: 4px; background-color: white; resize: vertical;
}
.additional-location { display: flex; align-items: center; margin-bottom: 0.5rem; }
.remove-location {
  background: transparent; color: #E34234; border: none; cursor: pointer;
  font-size: 0.9rem; padding: 0; margin-left: 0.5rem;
}
.remove-location:hover { transform: scale(1.2); }
.location-add-btn { /* Style for "Add Location" button in form */
  background: #115139; color: white; border: none; border-radius: 4px; padding: 0.3rem 0.6rem;
  margin-top: 0.5rem; cursor: pointer; font-size: 0.8rem; display: inline-flex; align-items: center; gap: 0.3rem;
}
.location-add-btn:hover { background: #176b47; }
.form-actions { display: flex; justify-content: center; gap: 1rem; margin-top: 1.5rem; margin-bottom: 0.5rem; }
.form-actions button { min-width: 100px; }
/* Mini button styles (used in form?) */
.mini-button {
  background: #115139; color: white; border: none; border-radius: 4px; padding: 0.3rem 0.6rem;
  cursor: pointer; font-size: 0.8rem; display: inline-flex; align-items: center; gap: 0.3rem;
}
.mini-button:hover { background: #176b47; }
.remove-location.mini-button { background-color: #cf4e4e; } /* If remove button uses mini-button class */
.remove-location.mini-button:hover { background-color: #d23333; }
/* Checkbox group styling */
.checkbox-group { display: flex; flex-wrap: wrap; gap: 10px; }
.checkbox-group label { display: flex; align-items: center; font-weight: normal; margin-right: 15px; font-size: 0.9rem; }
.checkbox-group input[type="checkbox"] { margin-right: 5px; width: auto; }

/* Search container */
#container_search {
    position: absolute; top: 7rem; left: 50%; transform: translateX(-50%);
    width: 40rem; max-width: 90%; text-align: center; z-index: 3; color: #A9A9A9;
}
#searchinput {
    width: 100%; height: 2.5rem; padding: 0.5rem 0.5rem 0.5rem 3rem; font-size: 1rem;
    border-radius: 20px; border: 1px solid #3D3635; background-color: rgba(211, 211, 211, 0.4);
    outline: none; transition: background-color 0.2s;
}
#searchinput:focus { background-color: #D3D3D3; border-color: #fff; }
#searchinput::placeholder { color: #000; }
#searchinput:hover::placeholder { color: #000; }
#searchinput:focus::placeholder { text-align: right; }
.fa-search { position: absolute; left: 1rem; top: 0.75rem; color: #000; }

/* Control buttons row */
#control-row {
    position: absolute; top: 11rem; left: 50%; transform: translateX(-50%);
    width: 100%; text-align: center; z-index: 3;
}
.search-button { /* Base class for buttons in control row */
    display: inline-block; margin: 0 0.5rem; padding: 0.5rem 1rem;
    border-radius: 5px; cursor: pointer; font-weight: 600;
}
.nvihbutton { /* General button style */
    background: #C1C1C1; border: 0; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
    cursor: pointer; padding: 0.5rem 1rem; transition-duration: 0.2s; -webkit-transition-duration: 0.2s;
}
.nvihbutton:hover { background: #588574; color: #fff; }
#filter-toggle { background-color: #7B3F00; color: white; border: none; transition: background-color 0.3s; }
#filter-toggle:hover, #filter-toggle.active { background-color: #9B5F20; }
#show-all-button.active { background-color: #588574; color: white; }

/* Filter container */
#filter-container {
    position: absolute; top: 16rem; left: 50%; transform: translateX(-50%);
    width: 90%; max-width: 62.5rem; padding: 1rem; background-color: #d3d3d3;
    border-radius: 5px; display: none; z-index: 10; box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.filter-row { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 1rem; }
.filter-field { flex: 1; min-width: 180px; margin: 0.25rem; }
.filter-field label { display: block; margin-bottom: 5px; font-weight: bold; font-size: 0.8rem; }
.filter-input, .filter-select { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; font-size: 0.9rem; }
.filter-input:disabled, .filter-select:disabled,
.zipcode-input:disabled, .distance-select:disabled { background-color: #e9e9e9; color: #999; cursor: not-allowed; opacity: 0.7; }
.filter-field.disabled label { color: #999; }
.dropdown-container { position: relative; }
.dropdown-list {
    display: none; position: absolute; width: 100%; max-height: 200px; overflow-y: auto;
    background-color: white; border: 1px solid #ccc; border-top: none; z-index: 100; /* High z-index for dropdown */
}
.dropdown-item { padding: 8px; cursor: pointer; font-size: 0.9rem; }
.dropdown-item:hover { background-color: #f0f0f0; }
.selected-items { margin-top: 5px; display: flex; flex-wrap: wrap; }
.selected-tag { display: inline-block; background-color: #e0e0e0; padding: 2px 8px; margin: 2px; border-radius: 10px; font-size: 0.9em; }
.remove-tag { cursor: pointer; margin-left: 5px; }
.filter-buttons { text-align: center; margin-top: 1rem; }
/* Distance filter specific styles */
.distance-filter-container { display: flex; gap: 5px; }
.zipcode-input { width: 40%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; font-size: 0.9rem; }
.distance-select { width: 60%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; font-size: 0.9rem; }

/* Provider results */
#provider-results {
    position: absolute; top: 15.5rem; left: 50%; transform: translateX(-50%);
    width: 90%; max-width: 62.5rem; z-index: 3; transition: top 0.3s ease;
}
/* Specialty group styling */
.specialty-group {
    margin-bottom: 1rem; /* Reduced from 2rem (50% reduction) */
    border-radius: 5px;
    overflow: hidden;
    display: none;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.specialty-header {
    background-color: #7B3F00;
    color: white;
    font-weight: bold;
    padding: 0.5rem 0.75rem; 
    border-radius: 5px 5px 0 0;
    margin: 0;
    font-size: 0.95rem; 
}
.specialty-content { background-color: transparent; }
.specialty-footer { height: 0.5rem; background-color: #115139; border-radius: 0 0 5px 5px; }

/* Provider row styling */
.provider-row {
    display: none; /* Initially hidden */
    background-color: #d3d3d3;
    padding: 1rem;
    margin: 0;
    border-bottom: 2px solid #115139; /* Green line using the same background color */
    transition: background-color 0.2s;
    position: relative;
}
.provider-row:hover { background-color: #f0f0f0; }
/* Row actions */
.row-actions { position: absolute; top: 1rem; right: 1rem; display: flex; align-items: center; z-index: 10; }
/* Favorite star and minimize button */
.favorite-star, .minimize-btn {
    margin-left: 0.75rem; cursor: pointer; font-size: 1.2rem; display: inline-block;
    width: 1.5rem; height: 1.5rem; text-align: center; line-height: 1.5rem; background: transparent;
}
.favorite-star:hover { color: gold; }
.favorite-star.favorite-1:hover { color: #1E88E5 !important; }
.minimize-btn { color: #115139; }
.minimize-btn:hover { color: #7A7A7A; }
.favorite-star.favorite-1 { color: gold !important; }
.favorite-star.favorite-2 { color: #1E88E5 !important; }
/* Provider content */
.tr_provname_text { font-size: 1.25rem; font-weight: 600; display: block; margin-top: -0.25rem; margin-bottom: 0.25rem; padding-right: 5rem; }
.specialty { display: none !important; } /* Hidden specialty field */
.lastedit { font-size: 0.7rem; font-style: italic; position: absolute; bottom: 0.25rem; right: 1rem; }
/* Expandable content within rows */
.expandable-section { margin-top: 0.5rem; }
.expand-header {
    background-color: #115125; color: white; padding: 0.3rem 0.5rem; border-radius: 3px;
    cursor: pointer; font-weight: 500; font-size: 0.9rem; margin-bottom: 0.3rem;
}
.expand-header:hover { background-color: #176b47; }
.expand-content { display: none; background-color: #d3d3d3; padding: 0.75rem; margin-bottom: 0.5rem; border-radius: 3px; }
.more-content { margin: 0.3125rem 0; }
.nested-expand-header {
    background-color: #757575; color: white; padding: 0.3rem 0.5rem; border-radius: 3px;
    cursor: pointer; font-weight: 500; font-size: 0.9rem; margin: 0.3rem 0;
}
.nested-expand-header:hover { background-color: #909090; }
.nested-expand-content { display: none; background-color: #c0c0c0; padding: 0.75rem; margin: 0.3rem 0; border-radius: 3px; }
/* Check container within rows */
.check_container {
    position: absolute; top: 1rem; right: 10rem; display: flex; flex-direction: column; width: auto; margin-top: 0;
}
.check_row { display: flex; justify-content: center; gap: 0.5rem; margin-bottom: 0.25rem; }
.check_container span { text-align: center; font-size: 0.7rem; font-weight: 500; line-height: 1.2; width: 4rem; }
.fa-check { font-size: 1.25rem; color: #4CBB17; text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000; }
.fa-xmark { font-size: 1.25rem; color: #E34234; text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000; }
/* Fixed favorites styling */
.favorite-1, .favorite-2 { position: relative; border-left-width: 4px; border-left-style: solid; padding-left: calc(1rem - 4px); }
.favorite-1 { border-left-color: gold; }
.favorite-2 { border-left-color: #1E88E5; }
/* Ensure star itself doesn't get border */
.favorite-1 .favorite-star, .favorite-2 .favorite-star { border: none !important; padding-left: 0 !important; background: transparent !important; }
/* Minimized row styling */
.minimized-row .tr_provinfo_text, .minimized-row .expandable-section, .minimized-row .check_container { display: none; }
/* Interactive elements */
.interact { cursor: default; }
.interact:hover { text-decoration: none; } /* Default underline on hover */
.hover:hover { text-decoration: underline solid 3px red; } /* Specific hover for preference */
/* Copied notification */
#copied {
    position: fixed; left: 50%; bottom: 2rem; transform: translateX(-50%); height: 2rem; width: 15rem;
    padding: 0; background: #7B3F00; font-size: 1rem; color: #fff; z-index: 100; overflow: hidden;
    text-align: center; border: solid 1px #3D3635; border-radius: 5px; display: none; box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}
.fa-clipboard { font-size: 1.5625rem; }
.fa-rectangle-xmark { color: #fff; font-size: 1rem; position: absolute; right: 0.188rem; top: 0.125rem; opacity: 0.5; }
.fa-rectangle-xmark:hover { opacity: 1; cursor: pointer; }

/* Responsive adjustments */
@media (max-width: 768px) {
    .search-tabs { position: relative; top: 0; right: 0; width: 100%; overflow-x: auto; justify-content: flex-start; padding: 10px 0; margin-bottom: 10px; }
    .tab-item { min-width: 70px; }
    .add-entry-button { /* Adjust position for smaller screens if needed */ }
}
@media screen and (max-device-width: 599px) { #searchinput { width: 11.7rem; } } /* Specific mobile adjustment */