/* Ensure the next row never tucks under the header */
.assistant-card.assistant--header .assistant-description{ margin-top: 2px; }
/* Tag row calmer chips */
.assistant-card.assistant--header .tag-row .hashtag{ font-size:.76rem; padding:2px 7px; }
/* Reset some basic styles for a clean slate */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Global Styles */
body {
    font-family: 'Roboto', sans-serif;
    background-color: #FFFFF0;
    /* Ivory background */
    color: #333333;
    /* Dark text for contrast */
    line-height: 1.6;
    padding: 0;
    margin: 0;
}

/* Adi's styles */
.citations {
    font-size: 0.65em;
    color: gray;
}



/* Login & Signup Buttons */
.btn-outline-primary2 {
    border: 2px solid #d4a56b;
    color: #d4a56b;
    padding: 8px 15px;
    border-radius: 25px;
    transition: all 0.3s ease;
}

.btn-outline-primary2:hover {
    background-color: #d4a56b;
    color: white !important;
}



/* Responsive Navbar Adjustments */
/* @media (max-width: 768px) {
    .navbar .container {
        padding: 0 10px;
    }

    .navbar a {
        padding: 8px 10px;
        font-size: 0.95rem;
    }

    .navbar .dropdown-item {
        font-size: 0.9rem;
    }
} */

/* Fix Bootstrap dropdown arrow resizing */
/* .navbar .nav-link.dropdown-toggle {
    font-size: inherit !important;
    display: flex;
    align-items: center;
} */

/* Keep the arrow size consistent */
/* .navbar .nav-link.dropdown-toggle::after {
    font-size: 0.8em;

    transition: transform 0.3s ease-in-out;

} */

/* Rotate arrow when dropdown is open */
/* .navbar .nav-link[aria-expanded="true"]::after {
    transform: rotate(180deg);

} */

/* === Navbar dropdown caret: consistent size + smooth rotation === */
.navbar.lx-navbar .nav-link.dropdown-toggle{
  font-size: inherit !important;           /* keep text scale */
  display: inline-flex; align-items: center; gap: .35rem; /* center arrow nicely */
}

/* Boostrap uses border-based caret; tweak its size & transition */
.navbar.lx-navbar .nav-link.dropdown-toggle::after{
  transition: transform .28s ease, border-color .2s ease; /* smooth rotate */
  vertical-align: baseline; margin-left: .15rem;
  /* make caret a touch larger & crisper */
  border-top-width: .38em; border-right-width: .38em; border-left-width: .38em;
}

/* Rotate caret only when actually open (aria-expanded=true) */
.navbar.lx-navbar .nav-link[aria-expanded="true"]::after{
  transform: rotate(180deg);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .navbar.lx-navbar .nav-link.dropdown-toggle::after{ transition: none !important; }
}

/* Content */
.content {
    padding-top: 80px;
    /* Adjusted for navbar height */
    padding-bottom: 60px;
    /* Ensure space at the bottom for footer */
    background-color: #FFFFF0;
    /* Ivory background */
    min-height: calc(100vh - 140px);
    /* Full height minus navbar and footer */
}

/* Footer Styles */
/* Footer Styles */
/* footer {
    background-color: #114949;

    color: #d6ae6b;

    text-align: center;
    padding: 30px 0;
    width: 100%;
    position: relative;

    bottom: 0;
}

footer .container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

footer .row {
    margin-left: 0;
    margin-right: 0;
}

footer h6 {
    font-weight: bold;
}

footer .footer-link {
    text-decoration: none;
    color: #d6ae6b;
}

footer .footer-link:hover {
    color: #fff;
}

footer .social-icons a {
    color: #d6ae6b;
    font-size: 1.5rem;
    margin-right: 15px;
}

footer .social-icons a:hover {
    color: #fff;
} */

/* Mobile responsiveness */
/* @media (max-width: 768px) {
    footer {
        padding: 20px 0;
    }

    footer .row {
        flex-direction: column;
    }

    footer .col-md-2 {
        width: 100%;
        margin-bottom: 10px;
    }

    footer .container p {
        font-size: 0.9rem;
    }

    footer .social-icons a {
        font-size: 1.2rem;
        margin-right: 10px;
    }
} */

/* Card Styles */
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 1.2rem;
    /* Rounded corners for cards */
    box-shadow: 0 12px 30px rgba(17, 73, 73, 0.8);
    height: 100%;
}

/* Card Image */
/* .card-img-top {
    border-top-left-radius: 1.2rem;
    border-top-right-radius: 1.2rem;
    height: auto;
    object-fit: contain;
} */

/* Card Title */
.card-title {
    font-size: 1.2rem;
    font-weight: bold;
    color: #333333;
}

/* Card Body Text */
.card-text {
    font-size: 1rem;
    color: #555555;
}

/* Hover Effect */
.card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 16px rgba(17, 73, 73, 0.6);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .col-md-4 {
        flex: 0 0 50%;
        /* On mobile, cards will be half-width */
        max-width: 50%;
    }

    .card {
        margin-bottom: 15px;
        /* Provide space between cards */
    }

    .card-title {
        font-size: 1rem;
        /* Smaller title for mobile */
    }

    .card-text {
        font-size: 0.9rem;
        /* Smaller text for mobile */
    }
}

@media (max-width: 480px) {
    .col-md-4 {
        flex: 0 0 100%;
        /* On very small screens, cards will be full-width */
        max-width: 100%;
    }

    .card-title {
        font-size: 1rem;
        /* Adjust title size further for very small screens */
    }

    .card-text {
        font-size: 0.85rem;
        /* Adjust text size for very small screens */
    }

    .card {
        margin-bottom: 20px;
        /* Increase spacing between cards */
    }
}

/* Hover Effect for the Button */
.btn.btn-outline-dark:hover {
    background-color: #114949;
    /* Teal color */
    border-color: #114949;
    /* Teal border */
    color: white;
    /* Text color changes to white */
}

.btn.btn-outline-dark1 {
    background-color: #114949;
    /* Teal color */
    border-color: #114949;
    /* Teal border */
    color: white;
    /* Text color changes to white */
}

.btn.btn-outline-dark1:hover {
    background-color: white;
    /* Teal color */
    border-color: #114949;
    /* Teal border */
    color: #114949;
    /* Text color changes to white */
}


.card.half-size {
    width: 90%;
    /* Adjusts the width to half of its current size */
    height: auto;
    /* Adjusts the height to half of its current size */
    transform: scale(0.9);
    /* Optional: scales down the card content */
    margin: auto;
    /* Centers the card */
    font-size: 0.75rem;
    /* Decreases text size */
    line-height: 1.2;
    /* Adjusts line height for compact text */
}

.card.half-size .card-text-content {
    padding: 1.5rem !important;
    /* Adjusts padding for text only */
    font-size: 0.75rem;
    /* Optional: adjust text size */
    line-height: 1.2;
    /* Optional: adjust line height */
}

.card.half-size img {
    display: block;
    width: 100%;
    /* Ensures the image fits within the card */
    margin: 0;
    /* Removes any default margin */
    padding: 0;
    /* No padding for the image */
}


/* Let's Tour Button */
.btn-tour {
    background-color: #114949;
    /* Teal Green */
    color: white;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.btn-tour:hover {
    background-color: white;
    color: #114949;
    border-color: #114949;
}

/* Let's Work Button */
.btn-work {
    background-color: #d4a56b;
    /* Golden Accent */
    color: white;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.btn-work:hover {
    background-color: white;
    /* Darker Gold */
    color: #d4a56b;
    /* Teal Green */
    border-color: #d4a56b;
}

/* Disabled/Restricted Feature Button */
.btn-work-disabled {
    background-color: #f5f5f5;
    /* Light Gray */
    color: #b0b0b0;
    /* Muted Gray */
    border: 2px solid #dcdcdc;
    cursor: not-allowed;
}

.btn-work-disabled:hover {
    background-color: #f5f5f5;
    color: #b0b0b0;
    border-color: #dcdcdc;
}


/* Define button colors */
.btn-114949 {
    background-color: #114949;
    color: #fff;
    border: 2px solid #114949;
    transition: background-color 0.3s, color 0.3s;
}

.btn-114949:hover {
    background-color: #0d3a3a;
    color: #d4a56b;
    border-color: #d4a56b;
}

.btn-hover.d4a56b:hover {
    background-color: #d4a56b;
    color: #114949;
    border-color: #114949;
}

/* Custom Text Color for Titles */
.text-114949 {
    color: white;
}

/* Carousel Image Container */
.carousel-image-container {
    position: relative;
    width: 100%;
    height: 100%;
}

/* Carousel Image Styling */
.carousel-image {
    width: 100%;
    height: 100%;
    /* Ensure the image covers the whole carousel */
    object-fit: cover;
    /* Fill the area without cutting off important parts of the image */
    object-position: center;
    /* Keep the image centered */
}

/* Set a fixed height for the carousel */
.carousel-inner {
    max-height: 800px;
    /* Adjust based on desired height */
}

/* Adjust the position of the carousel caption */
.carousel-caption {
    position: absolute;
    top: 65%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.5);
    /* Semi-transparent background */
    padding: 15px;
    border-radius: 10px;
    width: 80%;
    /* Make the caption wider, adjust as needed */
    max-width: 90%;
    /* Prevent it from being too wide on larger screens */
}

/* Optional: Style the carousel indicators for better visibility */
.carousel-indicators button {
    background-color: #114949;
}

.carousel-indicators .active {
    background-color: #d4a56b;
}


/* Button for submitting the form */
.btn-submit {
    background-color: #004d00;
    /* Dark Green */
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease;
}

.btn-submit:hover {
    background-color: #003300;
    /* Darker Green for hover effect */
    color: #e6ffe6;
    /* Light Green text on hover */
}

/* Button for navigating home */
.btn-home {
    background-color: #f0f0f0;
    /* Light Gray */
    color: #333;
    border: 1px solid #ccc;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-home:hover {
    background-color: #e6e6e6;
    /* Slightly darker gray on hover */
    color: #000;
    /* Darker text on hover */
}

/* Button for saving chat to PDF */
.btn-save {
    background-color: #66b2ff;
    /* Calm Blue */
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease;
}

.btn-save:hover {
    background-color: #3399ff;
    /* Darker Blue for hover effect */
    color: #e6f5ff;
    /* Light Blue text on hover */
}


.card {
    border-radius: 8px;
    border: 1px solid #ddd;
}

.card-title {
    font-size: 1.5rem;
    color: #114949;
    /* Match your primary theme color */
}

.card-text {
    font-size: 1rem;
    color: #333;
}



.bg-teal {
    background-color: #114949 !important;
    /* Teal background */
    color: #ffffff !important;
    /* White text */
}

.bg-teal2 {
    background-color: #E6E6E6 !important;
    /* Teal background */
    color: #114949 !important;
    /* White text */
}

/*#########*/
.card {
    border: 1px solid #e6e6e6;
    /* Subtle border for better definition */
    border-radius: 8px;
}

.card-title {
    font-size: 1.5rem;
    font-weight: bold;
}

pre {
    background-color: #f8f9fa;
    /* Light neutral background for preformatted text */
    border: 1px solid #e6e6e6;
    border-radius: 8px;
}

/* ####### */
.card {
    border-radius: 10px;
}

.card-title {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333333;
}

.btn-success {
    background-color: #004d00;
    /* Adjust to match your branding */
    border: none;
}

.btn-success:hover {
    background-color: #006600;
    /* Slightly brighter green for hover */
}



/* ##### */
.card {
    border-radius: 10px;
    padding: 20px;
}

.card-title {
    font-size: 1.8rem;
    font-weight: bold;
}

.btn-primary {
    background-color: #004d00;
    /* Match your branding */
    border: none;
}

.btn-primary:hover {
    background-color: #006600;
    /* Slightly brighter for hover */
}

.bg-teal {
    background-color: #114949;
    /* Teal color */
    color: #ffffff;
    /* White text for better readability */
}

.bg-teal-gradient {
    background: linear-gradient(135deg, #114949, #0f3d3d);
    /* Teal gradient */
    color: #ffffff;
    /* White text */
}


.disabled-assistant {
    filter: grayscale(100%);
    cursor: not-allowed;
    opacity: 0.9;
    transition: all 0.3s ease;
}

.disabled-assistant:hover {
    transform: none;
    /* Disable hover effect */
}

/* Ensure the container is properly positioned */
.textarea-container {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* Toolbar should be inside but not cover the label */
.toolbar {
    position: absolute;
    top: -30px;
    /* Move toolbar above the textarea */
    left: 8px;
    background: rgba(255, 255, 255, 0.9);
    padding: 4px 8px;
    border-radius: 6px;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

/* Style for toolbar buttons */
.toolbar button {
    border: none;
    background: transparent;
    font-size: 16px;
    cursor: pointer;
    padding: 2px 6px;
}

/* Adjust textarea padding to prevent text from overlapping the label */
#floatingTextarea {
    padding-top: 20px;
    /* Space for label */
    resize: none;
}

.text-teal {
    color: #114949;
}


.restricted-card {
    position: relative;
    opacity: 0.6;
    /* Makes it look restricted */
    cursor: pointer;
    /* Makes it look clickable */
}

.restricted-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
}

.square-rounded-img {
    width: 80px;
    /* Adjust size as needed */
    height: 80px;
    /* Ensures a perfect square */
    object-fit: cover;
    /* Prevents distortion */
    border-radius: 12px;
    /* Adds rounded borders */
}

.bg-orange {
    background-color: #FF5722;
}

.custom-accordion-header {
    background-color: #E6E6E6 !important;
    color: #333333;
    /* Dark text for contrast */
    font-weight: bold;
}

.custom-accordion-header:hover {
    background-color: #D4D4D4;
    /* Slightly darker on hover */
}

/* Active state (Green) */
.btn-upload {
    background-color: #004d00;
    /* Dark Green */
    color: white;
    border: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover Effect */
.btn-upload:hover {
    background-color: #006600;
    /* Slightly brighter green */
    color: white;
}

/* Inactive/Disabled State (Gray) */
.btn-upload:disabled {
    background-color: #E6E6E6 !important;
    /* Light Gray */
    color: #A0A0A0 !important;
    /* Muted text */
    border: 1px solid #DCDCDC;
    cursor: not-allowed;
}

.list-group-item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.list-group-item span {
    word-break: break-word;
    /* Prevents long filenames from breaking the layout */
    max-width: 70%;
    /* Ensures text doesn't take the whole row */
}

.badge {
    white-space: nowrap;
    /* Prevents badges from wrapping unnecessarily */
    font-size: 0.85rem;
    /* Slightly smaller badges for better fit */
}

.bg-gr {
    background-color: #114949;
}


/* Always solid buttons */
.btn-info {
    background-color: #17a2b8 !important;
    /* Bootstrap "info" blue */
    color: white !important;
    border-color: #117a8b !important;
}

.btn-success {
    background-color: #FF5722 !important;
    /* Bootstrap "success" green */
    color: white !important;
    border-color: #FF5722 !important;
}

/* New hover effect: Slightly darker background */
.btn-info:hover {
    background-color: #117a8b !important;
    /* Darker blue on hover */
    border-color: #0d5e73 !important;
}

.btn-success:hover {
    background-color: #218838 !important;
    /* Darker green on hover */
    border-color: #1a682b !important;
}

.language-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    display: inline-flex;
    align-items: center;
}

.language-btn img.flag-icon {
    width: 26px;
    /* Dimensiune implicită */
    height: auto;
    transition: transform 0.2s ease-in-out;
}

/* Hover Effect */
.language-btn:hover img.flag-icon {
    transform: scale(1.1);
}

/* Dimensiuni mai mici pe mobil */
@media (max-width: 768px) {
    .language-btn img.flag-icon {
        width: 20px;
        /* Mai mic pe ecrane mici */
    }
}

@media (min-width: 992px) {
    .profile-language-container {
        gap: 20px;
        /* Adaugă spațiu între profil și stegulețe */
    }
}

/* ========================= */
/* 🚀 Assistant Business Cards - Original Size & Animation */
/* ========================= */

.assistant-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 12px;
    border: none;
    background: linear-gradient(135deg, #ffffff, #f3f3f3);
    box-shadow: 0 12px 30px rgba(17, 73, 73, 0.8);
    /* Stronger shadow for premium look */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding: 20px;
    width: 100%;
    max-width: 550px;
    /* Keeps original large size */
    min-height: 160px;
    position: relative;
}

/* Hover Effect (Original Animation) */
.assistant-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 16px rgba(17, 73, 73, 0.6);
    /* Smooth hover effect */
    border-color: #004d00;
    background: linear-gradient(135deg, #ffffff, #eef2f3);
    /* Light gradient shift */
}

/* Text Section */
.assistant-info {
    flex: 1;
    padding-right: 15px;
    text-align: left;
}

/* Assistant Name */
.assistant-name {
    font-size: 1.5rem;
    font-weight: bold;
    color: #004d00;
    margin-bottom: 5px;
}

/* Assistant Title */
.assistant-title {
    font-size: 1.1rem;
    color: #666;
    font-style: italic;
    margin-bottom: 8px;
}

/* Assistant Description */
.assistant-description {
    font-size: 1rem;
    color: #444;
    max-width: 90%;
    /* Keeps text readable */
}

/* Assistant Image (Rounded Square) */
.assistant-img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 16px;
    /* Ensures rounded corners */
    border: none !important;
    transition: transform 0.3s ease-in-out;
}

/* Image Hover Effect */
.assistant-card:hover .assistant-img {
    transform: scale(1.05);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .assistant-card {
        flex-direction: row;
        max-width: 100%;
    }

    .assistant-name {
        font-size: 1.3rem;
    }

    .assistant-title {
        font-size: 1rem;
    }

    .assistant-description {
        font-size: 0.9rem;
    }

    .assistant-img {
        width: 80px;
        height: 80px;
    }
}


/* 🚀 Assistant Card - Vivian & Lexi */
.assistant-card.vivian-lexi {
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    border: none;
    background: linear-gradient(135deg, #ffffff, #f3f3f3);
    box-shadow: 0 12px 30px rgba(17, 73, 73, 0.8);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding: 20px;
    width: 100%;
    max-width: 550px;
    /* Matches other cards */
    min-height: 220px;
}

/* Hover Effect */
.assistant-card.vivian-lexi:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(17, 73, 73, 0.6);
    background: linear-gradient(135deg, #ffffff, #eef2f3);
}

/* Assistant Content */
.assistant-content {
    width: 100%;
}

/* Each Assistant Row */
.assistant-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}

/* Assistant Text */
.assistant-info {
    flex: 1;
    text-align: left;
    padding-right: 15px;
}

/* Assistant Name */
.assistant-name {
    font-size: 1.5rem;
    font-weight: bold;
    color: #004d00;
    margin-bottom: 5px;
}

/* Assistant Title */
.assistant-title {
    font-size: 1.1rem;
    color: #666;
    font-style: italic;
    margin-bottom: 8px;
}

/* Assistant Description */
.assistant-description {
    font-size: 1rem;
    color: #444;
}

/* Assistant Image Container */
.assistant-image {
    flex-shrink: 0;
}

/* Assistant Images (Rounded Square) */
.assistant-img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 16px;
    /* Ensures rounded corners */
    border: 4px solid #114949;
    transition: transform 0.3s ease-in-out;
}

/* Separator between Vivian and Lexi */
.assistant-divider {
    border: none;
    border-top: 1px solid #ccc;
    margin: 10px 0;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .assistant-row {
        flex-direction: column;
        /* Stack text and images vertically on mobile */
        text-align: center;
    }

    .assistant-info {
        padding-right: 0;
    }

    .assistant-image {
        margin-top: 10px;
    }

    .assistant-name {
        font-size: 1.3rem;
    }

    .assistant-title {
        font-size: 1rem;
    }

    .assistant-description {
        font-size: 0.95rem;
    }

    .assistant-img {
        width: 80px;
        height: 80px;
        border-radius: 16px;
        /* Keeps roundness on mobile */
    }

    .assistant-card.vivian-lexi {
        margin-bottom: 20px;
        /* Adds space below Vivian & Lexi's card */
    }
}


@media (max-width: 768px) {
    #save-pdf {
        font-size: 0.55rem;
        /* Smaller text */
        padding: 3px 3px;
        /* Reduce button padding */
        width: auto;
        /* Prevents buttons from stretching full width */
        margin-left: 10px;
        /* Adds space between text and button */
    }

    #save-docx {
        font-size: 0.55rem;
        /* Smaller text */
        padding: 3px 3px;
        /* Reduce button padding */
        width: auto;
        /* Prevents buttons from stretching full width */
    }
}

.text-teal {
    color: #114949 !important;
    /* Adjust this to your specific teal shade */
}

.text-or {
    color: #FF5722 !important;

}


/* 🔹 Button Section: Proper Spacing & Alignment */
.button-section {
    display: flex;
    justify-content: center;
    /* Center buttons */
    gap: 15px;
    /* Space between buttons */
    padding: 20px 10px;
    /* Adds some margin around */
    flex-wrap: wrap;
    /* Ensures responsiveness */
}

/* 🔹 General Button Styling */
.custom-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #114949;
    color: white;
    border: none;
    border-radius: 12px;
    padding: 14px 22px;
    font-size: 1rem;
    text-align: center;
    width: 200px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    font-weight: 500;
}

/* 🔹 Adjust Individual Button Colors */
.btn-info {
    background-color: #17a2b8;
}

.btn-success {
    background-color: #2e7d32;
}

.btn-warning {
    background-color: #ff8f00;
}

/* 🔹 Hover Effects: Slightly Darker & Subtle Lift */
.custom-btn:hover {
    transform: translateY(-3px);
    filter: brightness(1.15);
}

/* 🔹 Button Icons & Text Formatting */
.custom-btn span {
    display: block;
    font-size: 0.85rem;
    opacity: 0.85;
    margin-top: 6px;
}

/* 🔹 Responsive Adjustments */
@media (max-width: 768px) {
    .button-section {
        flex-direction: column;
        /* Stack buttons on smaller screens */
        align-items: center;
    }

    .custom-btn {
        width: 180px;
        font-size: 0.95rem;
        padding: 12px 18px;
    }

    .custom-btn span {
        font-size: 0.8rem;
    }
}


/* Progress Bar (YouTube-style) */
#loading-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 4px;
    background: #007bff;
    /* Blue */
    z-index: 9999;
    transition: width 0.3s ease-out, opacity 0.5s ease-out;
}

/* Small Floating Spinner */
#floating-spinner {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    /* Initially hidden */
    z-index: 9999;
}


.floating-label {
    position: absolute;
    top: 12px;
    left: 16px;
    color: #6c757d;
    transition: 0.3s ease-in-out;
    pointer-events: none;
    font-size: 16px;
}

textarea:focus+.floating-label,
textarea:not(:placeholder-shown)+.floating-label {
    top: -8px;
    left: 12px;
    font-size: 12px;
    color: #007bff;
}


/* Enhanced styling for card-body list-group-item to prevent overflow on mobile devices */
.card-body .list-group-item {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    display: block;
    max-width: 100%;
}

.card-body .list-group-item {
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}


.hover-effect:hover {
    color: #0056b3 !important;
    text-decoration: underline !important;
}

/* Improved layout and responsiveness */
.list-group-item {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.list-group-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
    .card-header {
        flex-direction: column;
        text-align: center;
    }

    .card-header a {
        margin-top: 10px;
    }
}


/* Ensure the card scales properly across devices */
.card {
    max-height: 90vh;
    /* Prevents card from becoming too tall */
    overflow: hidden;
    /* Ensures border-radius applies correctly */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 16px;
    /* Rounded corners for the card */
}

/* Updated Card Image: Circular */
.card-img-top {

    object-fit: cover;
    /* Cover the area without distortion */
    border-radius: 16px;
    /* Fully round the image */
    margin: auto;
    /* Center the image horizontally */
    display: block;
}

.card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 1rem;
}

.card-body .btn {
    width: auto;
    /* Prevents buttons from stretching */
    padding: 10px 20px;
    align-self: center;
    /* Centers the button within the card */
}

@media (max-width: 768px) {
    .card {
        max-height: none;
    }

    .card-img-top {

        border-radius: 16px;
        /* Fully rounded */
    }
}

.card-body .btn {
    pointer-events: auto;
    position: relative;
    z-index: 1;
}


/*  chat html */

.custom-textarea-wrapper {
    position: relative;
}

.custom-scrollable-textarea {
    height: 80px;
    max-height: 80px;
    overflow-y: auto;
    resize: none;
    padding-right: 70px;
    /* space for read more button */
    transition: max-height 0.3s ease;
}

.custom-scrollable-textarea.expanded {
    max-height: 300px;
}

.btn-ghost2 {
    background: transparent;
    border: 2px solid #114949;
    /* Your main color */
    color: #114949;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s, color 0.3s;
    text-decoration: none;
}

.btn-ghost2:hover {
    background-color: rgba(17, 73, 73, 0.1);
    /* A subtle fill effect on hover */
    color: #114949;
    /* Keeping text color consistent or switching to white if you prefer a stronger contrast */
}




.btn-gradient {
    border: none;
    color: white;
    padding: 10px 20px;
    border-radius: 4px;
    transition: opacity 0.3s;
    text-decoration: none;
}

.btn-gradient:hover {
    opacity: 0.85;
}

.btn-gradient.disabled,
.btn-gradient:disabled {
    opacity: 0.65;
    pointer-events: none;
}

.btn-gradient-pdf {
    background: linear-gradient(45deg, #00d2ff, #3a7bd5);
}

.btn-gradient-docx {
    background: linear-gradient(45deg, #ff8c00, #ff4500);
}



.btn-send {
    background: linear-gradient(45deg, #114949, #1abc9c);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    /* Creates a pill shape */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    font-size: 16px;
    text-decoration: none;
}

.btn-send:hover {
    transform: scale(1.03);
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.25);
}

.btn-send:active {
    transform: scale(0.98);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}


/* Container styling for proper spacing and responsiveness */
.button-section-low {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    margin: 20px 0;
}

/* Shared button styles */
.button-section-low button {
    padding: 12px 20px;
    border: none;
    border-radius: 30px;
    /* Pill shape for a modern look */
    font-size: 16px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    min-width: 160px;
    margin: 0 8px;
}

.button-section-low button:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Primary action buttons with vibrant gradients */
.custom-btn.btn-create {
    background: linecreatear-gradient(45deg, #00d2ff, #3a7bd5);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    /* Creates a pill shape */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    font-size: 16px;
    text-decoration: none;
}

.custom-btn.btn-view {
    background: linear-gradient(45deg, #ffc107, #ff8c00);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    /* Creates a pill shape */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    font-size: 16px;
    text-decoration: none;
}

.custom-btn.btn-work {
    background: linear-gradient(45deg, #343a40, #23272b);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    /* Creates a pill shape */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    font-size: 16px;
    text-decoration: none;
}

/* Secondary ghost button style */
.btn-ghost {
    background: rgba(17, 73, 73, 0.03);
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    /* Creates a pill shape */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    font-size: 16px;
    text-decoration: none;
}

.btn-ghost:hover {
    background: rgba(17, 73, 73, 0.1);
}


@media (max-width: 576px) {
    .container.py-5 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    h1 {
        font-size: 1.75rem;
    }

    p {
        font-size: 0.95rem;
    }
}



/* Smaller upload icon inside the textarea */
.custom-textarea-wrapper .upload-icon {
    color: #114949;
    /* ensure the icon and border share this color */
    font-size: 0.95rem;
    /* makes the 📎 smaller */
    padding: 0.45rem;
    /* tighter click area */
    min-width: auto;
    /* override any default button width */
    line-height: 1;
    /* vertically center the icon */
    border-radius: 0.50rem;
    border: 1px solid currentColor;
    /* match border to icon color */
}



#loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

#loading-overlay.show {
    display: flex;
}


/* Container for attached files: vertical scroll only */
.attached-files-container {
    display: flex;
    flex-direction: column;
    /* keep items stacked vertically */
    gap: 0.5rem;
    /* space between items */
    overflow-y: auto;
    /* vertical scroll when too tall */
    overflow-x: auto;
    /* horizontal scroll when items too wide */
    max-height: 8rem;
    /* limit height before vertical scroll */
    width: 100%;
    /* fill available width */
    padding: 0.25rem 0;
    /* background: #f8f9fa; */
    border-radius: 0.25rem;
}

/* Each file link as a “chip” */
.attached-file-item {
    flex: 0 0 auto;
    /* don’t grow or shrink */
    /* background: #e2e3e5; */
    color: #333;
    text-decoration: none;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.85rem;
    white-space: nowrap;
    /* no wrapping inside chip */
}

/* Responsive tweak: smaller max-height on narrow screens */
@media (max-width: 576px) {
    .attached-files-container {
        max-height: 6rem;
    }
}



.markdown-small * {
    font-size: 0.85rem !important;
    line-height: 1.5 !important;
}



/* Container for the little icon buttons */
.icon-button-group {
    position: absolute;
    right: 0.5rem;
    bottom: 0.25rem;
    display: flex;
    gap: 0.25rem;
    /* ensure its parent is positioned relative */
    z-index: 1;
}

/* Style every icon button */
.icon-button-group .icon-btn {
    font-size: 0.8rem;
    padding: 0.2rem;
    width: 1.6rem;
    height: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: 0.25rem;
    transition: background 0.2s;
}

.icon-button-group .icon-btn:hover,
.icon-button-group .icon-btn:focus {
    background: rgba(0, 0, 0, 0.05);
    outline: none;
}


.attached-file-item-container {
    position: relative;
    padding: 0.2rem 0.4rem;
    border-radius: 3px;
    transition: background-color 0.2s ease-in-out;
}

.attached-file-item-container:hover {
    background-color: #f8f9fa;
}

.lexi-button-group {
    display: none;
    flex-direction: row;
    gap: 0.15rem;
    padding: 0.25rem 0.4rem;
    margin-right: 0.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}

.lexi-button-group .icon-btn {
    border: none;
}

.attached-file-item-container:hover .lexi-button-group {
    display: flex;
}

.lexi-button-group .icon-btn {
    padding: 0.2rem;
    font-size: 0.85rem;
    line-height: 1;
    min-width: auto;
}


/* === LX Navbar – Ivory glossy theme === */
.navbar.lx-navbar {
  background: linear-gradient(
    180deg,
    rgba(255,255,240,0.75) 0%,
    rgba(255,255,240,0.58) 80%
  ) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  box-shadow: 0 3px 12px rgba(17,73,73,0.05) !important;
  border-bottom: 1px solid rgba(17,73,73,0.16) !important;
  position: fixed; top:0; left:0; width:100%; z-index:999;
}
.navbar.lx-navbar::before {
  content:"";
  position:absolute; top:0; left:0; right:0; height:45%;
  background: linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0));
  pointer-events:none;
}
.navbar.lx-navbar.lx-navbar-scrolled {
  background: linear-gradient(
    180deg,
    rgba(255,255,240,0.92) 0%,
    rgba(255,255,240,0.78) 80%
  ) !important;
  box-shadow: 0 6px 16px rgba(17,73,73,0.08) !important;
  border-bottom-color: rgba(17,73,73,0.22) !important;
}
/* Linkuri */
.navbar.lx-navbar .nav-link {
  position: relative;
  font-weight: 500;
  color:#114949 !important;
  padding-inline:.75rem;
  transition: color .25s ease;
}
.navbar.lx-navbar .nav-link:hover { color:#d4a56b !important; }
.navbar.lx-navbar .nav-link::after {
  content:""; position:absolute; left:50%; bottom:.3rem;
  height:2px; width:0; background:linear-gradient(90deg,#114949,#d4a56b);
  opacity:0; transition:width .25s ease,left .25s ease,opacity .25s ease;
}
/* Thinner underline ONLY for Profile dropdown */
.navbar.lx-navbar .nav-link.dropdown-toggle.profile-link::after{
  height:1px !important;
}
.navbar.lx-navbar .nav-link:hover::after { left:10%; width:80%; opacity:.9; }

/* === WOW EFFECT for standard nav links (Discover / Meet) === */
.navbar.lx-navbar .nav-link{
  letter-spacing: .3px;            /* readability */
  padding: .5rem .9rem;            /* a bit more hit area */
  overflow: hidden;                /* clip shine */
  transition: color .25s ease, transform .25s ease, text-shadow .25s ease;
}

/* Lift + subtle golden glow on hover */
.navbar.lx-navbar .nav-link:hover{
  transform: translateY(-2px);
  text-shadow: 0 0 6px rgba(212,165,107,.35);
}

/* Diagonal shine sweep */
.navbar.lx-navbar .nav-link::before{
  content: ""; position: absolute; top: -40%; left: -25%; width: 50%; height: 180%;
  background: linear-gradient(75deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 60%);
  transform: translateX(-110%) skewX(-18deg);
  opacity: 0; pointer-events: none; filter: blur(.4px);
}
.navbar.lx-navbar .nav-link:hover::before{ animation: navLinkShine 1.8s ease forwards; opacity: 1; }

@keyframes navLinkShine{
  0%   { transform: translateX(-120%) skewX(-18deg); opacity: 0; }
  22%  { opacity: .6; }
  100% { transform: translateX(210%)  skewX(-18deg); opacity: 0; }
}

/* Keep things calm for Reduced Motion users */
@media (prefers-reduced-motion: reduce){
  .navbar.lx-navbar .nav-link{ transition: none !important; }
  .navbar.lx-navbar .nav-link::before{ display: none !important; }
}

/* Active pill */
.navbar.lx-navbar .nav-item.active > .nav-link,
.navbar.lx-navbar .nav-link[aria-current="page"],
.navbar.lx-navbar .nav-link.is-current {
  background: rgba(17,73,73,0.10) !important;
  border:1px solid #114949 !important;
  border-radius:999px !important;
  padding:.35rem .8rem !important;
  color:#114949 !important;
  font-weight:600 !important;
}
.navbar.lx-navbar .nav-link.active:hover,
.navbar.lx-navbar .nav-link[aria-current="page"]:hover { background:rgba(17,73,73,0.16) !important; }

/* CTA buttons */
.btn-primary2 {
  background:#114949; border:2px solid #114949; color:#fff !important;
  border-radius:999px; padding:.45rem .9rem; font-weight:600;
  transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.btn-primary2:hover { background:#0d3a3a; border-color:#0d3a3a; transform:translateY(-1px); box-shadow:0 4px 12px rgba(212,165,107,0.35); }
.btn-outline-primary2 {
  background:transparent; border:2px solid #114949; color:#114949 !important;
  border-radius:999px; padding:.45rem .9rem; font-weight:600;
  transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.btn-outline-primary2:hover { background:#ffcc00; border-color:#ffcc00; color:#1c483a !important; transform:translateY(-1px); box-shadow:0 4px 12px rgba(212,165,107,0.35); }

/* Profile icon hover */
.navbar.lx-navbar .profile-language-container i,
.navbar.lx-navbar .profile-language-container svg,
.navbar.lx-navbar .profile-language-container .profile-icon {
  color:#114949 !important; transition:color .25s, transform .25s;
}
.navbar.lx-navbar .profile-language-container i:hover,
.navbar.lx-navbar .profile-language-container .profile-icon:hover {
  color:#d4a56b !important; transform:scale(1.1);
}

/* Mobile menu sheet */
@media (max-width: 991.98px){
  .navbar.lx-navbar .navbar-collapse.show{
    background: rgba(255,250,235,0.88);
    -webkit-backdrop-filter: blur(8px) saturate(120%);
    backdrop-filter: blur(8px) saturate(120%);
    border-bottom:1px solid rgba(17,73,73,0.16);
    box-shadow:0 8px 18px rgba(0,0,0,0.08);
  }
  .navbar.lx-navbar .navbar-nav .nav-link{ padding:12px 16px; font-size:1rem; }
  .navbar.lx-navbar .dropdown-item{ padding:10px 16px; }
}

/* === Footer slim === */
.lx-footer {
  background-color: rgba(0,0,0,0.02);
  color:#555; text-align:center; width:100%; padding:10px 0;
  border-top:1px solid rgba(17,73,73,0.10);
}
.lx-footer .lx-footer-link { font-size:0.85rem; color:#555; text-decoration:none; margin-right:0.75rem; }
.lx-footer .lx-footer-link:hover{ text-decoration:underline; }
.lx-footer small{ color:#777; }

/* === Hero microcards – solid teal === */
.lx-hero .microcard {
  position:relative;
  border-radius:16px;
  padding:16px 18px;
  min-height:120px;
  background:linear-gradient(180deg,#1c6f6f,#155e5e,#114949) !important;
  border:1px solid rgba(0,0,0,0.08) !important;
  box-shadow:0 8px 18px rgba(0,0,0,0.08) !important;
  color:#fff !important;
  display:flex; flex-direction:column; align-items:flex-start;
  overflow:visible !important;
  transition:all .25s;
}
.lx-hero .microcard:hover{ filter:brightness(1.05); transform:translateY(-2px); box-shadow:0 12px 22px rgba(0,0,0,0.12) !important; }
.lx-hero .microcard-icon{
  width:48px; height:48px; border-radius:10px;
  display:grid; place-items:center;
  background:rgba(255,255,255,0.14) !important;
  color:#ffcc00 !important;
  font-size:1.6rem !important;
  margin-bottom:10px;
}
.lx-hero .microcard-title{ color:#fff !important; font-weight:700; margin-bottom:8px !important; }
.lx-hero .microcard-text{ color:rgba(255,255,255,0.92) !important; }

/* === MICROCARDS WOW UPGRADE === */
/* Performance hints & baseline polish */
.lx-hero .microcard{
  will-change: transform, box-shadow, filter;
  transform: translateZ(0);
}

/* Shine sweep & ambient glow layers */
.lx-hero .microcard::before,           /* moving shine */
.lx-hero .microcard::after{            /* soft corner glow */
  content: ""; position: absolute; pointer-events: none; opacity: 0; transition: opacity .25s ease;
}
/* Diagonal shine that sweeps on hover */
.lx-hero .microcard::before{
  inset: -30% -50%;
  background: linear-gradient(75deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.35) 50%, rgba(255,255,255,0) 62%);
  transform: translateX(-60%) skewX(-18deg);
  filter: blur(.6px);
}
/* Corner glow that breathes in */
.lx-hero .microcard::after{
  top: -8px; right: -8px; width: 140px; height: 140px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(212,165,107,.35), rgba(212,165,107,0));
  filter: blur(10px);
}

/* Hover state: lift + deeper shadow + color pop */
.lx-hero .microcard:hover{
  transform: translateY(-6px);
  box-shadow: 0 14px 28px rgba(17,73,73,0.22), 0 6px 12px rgba(0,0,0,0.10) !important;
  filter: saturate(1.04);
}
.lx-hero .microcard:hover::after{ opacity: 1; }
.lx-hero .microcard:hover::before{ animation: microShine 1.8s ease forwards; opacity: 1; }

/* Icon micro-interaction */
.lx-hero .microcard .microcard-icon{ transition: transform .22s ease, filter .22s ease; }
.lx-hero .microcard:hover .microcard-icon{ transform: translateY(-2px) scale(1.04); filter: drop-shadow(0 2px 4px rgba(0,0,0,.15)); }

/* Title/link subtle underline grow on hover */
.lx-hero .microcard .microcard-title, .lx-hero .microcard-title{ position: relative; }
.lx-hero .microcard .microcard-title::after, .lx-hero .microcard-title::after{
  content:""; position:absolute; left:10%; bottom:-4px; height:2px; width:0; opacity:.85;
  background: linear-gradient(90deg,#ffcc00,#ffffff);
  transition: width .25s ease, left .25s ease;
}
.lx-hero .microcard:hover .microcard-title::after, .lx-hero .microcard:hover .lx-hero .microcard-title::after{ left:6%; width:88%; }

/* Keyboard focus for accessibility */
.lx-hero .microcard:focus-visible{
  outline: 2px solid rgba(212,165,107,.85);
  outline-offset: 3px;
}

/* Keyframes for the diagonal shine */
@keyframes microShine{
  0%   { transform: translateX(-65%) skewX(-18deg); opacity: 0; }
  25%  { opacity: .55; }
  100% { transform: translateX(65%)  skewX(-18deg); opacity: 0; }
}

/* Reduce motion when requested */
@media (prefers-reduced-motion: reduce){
  .lx-hero .microcard,
  .lx-hero .microcard .microcard-icon{ transition: none !important; }
  .lx-hero .microcard::before,
  .lx-hero .microcard::after{ display:none !important; }
}

/* Mobile microcards */
@media (max-width: 576px){
  .lx-hero .microcard{
    background:linear-gradient(180deg,#176b6b,#124f4f) !important;
    border-color:rgba(0,0,0,0.10) !important;
    box-shadow:0 8px 16px rgba(0,0,0,0.12) !important;
    min-height:140px;
  }
  .lx-hero .row.g-3 > .col-md-4{ flex:0 0 100% !important; max-width:100% !important; }
}

/* === Accessibility focus ring === */
:focus-visible {
  outline:2px solid rgba(212,165,107,.85);
  outline-offset:2px;
}
.navbar.lx-navbar .btn:focus-visible,
.lx-hero .btn-tour:focus-visible,
.lx-hero .btn-work:focus-visible {
  box-shadow:0 0 0 3px rgba(212,165,107,.25);
}


/* === FIX: Hero image sizing + enforce glass transparency === */
/* Apply to both .lx-glass-card and fallback .lx-image-card/.image-card */
.lx-hero .lx-glass-card,
.lx-hero .card.lx-image-card,
.lx-hero .image-card{
  position: relative;
  padding: 12px;                 /* inner breathing */
  overflow: hidden;              /* clip image corners */
  background: linear-gradient(180deg, rgba(255,255,255,0.32), rgba(255,255,255,0.16)) !important; /* much more transparent */
  border: 1px solid rgba(212,165,107,0.25) !important; /* subtle gold */
  border-radius: 18px;           /* ensure smooth corners */
  background-clip: padding-box;  /* keep border crisp */
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
  backdrop-filter: blur(14px) saturate(160%) !important;
  box-shadow: 0 12px 24px rgba(17,73,73,0.08) !important; /* softer shadow */
}

.lx-hero .lx-glass-card::before,
.lx-hero .card.lx-image-card::before,
.lx-hero .image-card::before{
  content: ""; position:absolute; left:10px; right:10px; top:10px; height:40%;
  border-radius: 14px; pointer-events:none;
  background: linear-gradient(180deg, rgba(255,255,255,0.35), rgba(255,255,255,0));
}

.lx-hero .lx-glass-card::after,
.lx-hero .card.lx-image-card::after,
.lx-hero .image-card::after{
  content: ""; position:absolute; left:8px; right:8px; bottom:8px; height:28%;
  border-radius: 14px; pointer-events:none;
  background: linear-gradient(0deg, rgba(255,255,255,0.12), rgba(255,255,255,0));
}

/* Constrain the card width so it doesn't dominate the layout */
@media (min-width: 992px){
  .lx-hero .lx-glass-card,
  .lx-hero .card.lx-image-card,
  .lx-hero .image-card{ max-width: 520px; margin-left: auto; }
}
@media (max-width: 991.98px){
  .lx-hero .lx-glass-card,
  .lx-hero .card.lx-image-card,
  .lx-hero .image-card{ max-width: 100%; margin-left: 0; }
}

/* Make sure the image fits and keeps aspect ratio */
.lx-hero .lx-glass-card img,
.lx-hero .card.lx-image-card img,
.lx-hero .image-card img{
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;            /* prevents overflows on desktop */
  object-fit: cover;
  border-radius: 12px;           /* match container rounding */
}
@media (max-width: 576px){
  .lx-hero .lx-glass-card img,
  .lx-hero .card.lx-image-card img,
  .lx-hero .image-card img{ max-height: 340px; }
}

/* Prevent any default card body from painting opaque white */
.lx-hero .lx-glass-card .card-body,
.lx-hero .card.lx-image-card .card-body,
.lx-hero .image-card .card-body{ background: transparent !important; }





/* === Auth pills finale: Log In (outline teal) + Sign Up (gold) === */

/* Base (în tot site-ul) */
.btn-outline-primary2 {
  background: transparent !important;
  border: 2px solid #114949 !important;
  color: #114949 !important;
  padding: 8px 15px;
  border-radius: 25px;
  font-weight: 600;
  transition: all .3s ease;
}
.btn-outline-primary2:hover {
  background: #114949 !important;
  color: #fff !important;
  border-color: #114949 !important;
}

.btn-primary2 {
  background: #7a002a !important;         /* gold solid */
  border: 2px solid #7a002a !important;
  color: #fff !important;                  /* text clar pe gold */
  border-radius: 25px;
  padding: 8px 15px;
  font-weight: 600;
  transition: all .3s ease;
}
.btn-primary2:hover {
  background: #980035 !important;
  border-color: #980035 !important;
  color: #fff !important;
}

/* Navbar: versiuni „pill” și cu prioritate mai mare */
.navbar.lx-navbar .btn-outline-primary2{
  border-radius: 999px !important;
  padding: .42rem 1rem !important;
  line-height: 1 !important;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: none;
}
.navbar.lx-navbar .btn-outline-primary2:hover{
  box-shadow: 0 0 8px rgba(17,73,73,.2) !important;
  transform: translateY(-1px);
}

.navbar.lx-navbar .btn-primary2{
  background: #d4a56b !important;
  border: 1.5px solid #d4a56b !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: .42rem 1rem !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  display: inline-flex; align-items: center; justify-content: center;
}
.navbar.lx-navbar .btn-primary2:hover{
  background: #c19052 !important;
  border-color: #c19052 !important;
  box-shadow: 0 0 10px rgba(212,165,107,.35) !important;
  transform: translateY(-1px);
}

/* Spacing curat între Log In, Sign Up și stegulețe */
.navbar.lx-navbar .profile-language-container{
  display: flex;
  align-items: center;
  gap: 16px !important; /* +spacing între butoane și steaguri */
}


/* === NAVBAR AUTH PILLS SPACING (no HTML changes) === */
@media (min-width: 992px){
  /* space between the two pills */
  .navbar.lx-navbar .btn-outline-primary2 + .btn-primary2 { margin-left: 16px !important; }
  .navbar.lx-navbar .btn-primary2 + .btn-outline-primary2 { margin-left: 16px !important; }

  /* spacing from pills to flags, regardless of container structure */
  .navbar.lx-navbar .btn-primary2 + .language-btn,
  .navbar.lx-navbar .btn-outline-primary2 + .language-btn { margin-left: 18px !important; }

  /* if there's a wrapper, keep it tidy too */
  .navbar.lx-navbar .profile-language-container { gap: 16px !important; }
}

/* On mobile the pills are full width; avoid horizontal gaps that could break layout */
@media (max-width: 991.98px){
  .navbar.lx-navbar .btn-outline-primary2,
  .navbar.lx-navbar .btn-primary2 { margin: 6px 0 !important; }
}

/* === FIX: Login/SignUp pills spacing + no underline on hover === */
/* Never underline these pills (even if they are <a> links) */
.navbar.lx-navbar .btn-outline-primary2,
.navbar.lx-navbar .btn-primary2 {
  text-decoration: none !important;
}
.navbar.lx-navbar .btn-outline-primary2:hover,
.navbar.lx-navbar .btn-primary2:hover,
.navbar.lx-navbar .btn-outline-primary2:focus,
.navbar.lx-navbar .btn-primary2:focus {
  text-decoration: none !important;
}

/* Always keep a gap between the two pills, whichever comes first */
.navbar.lx-navbar .btn-outline-primary2 + .btn-primary2,
.navbar.lx-navbar .btn-primary2 + .btn-outline-primary2 {
  margin-left: 16px !important; /* mai mult spațiu între Log In și Sign Up */
}

/* Keep a gap between any pill and the language button */
.navbar.lx-navbar .btn-primary2 + .language-btn,
.navbar.lx-navbar .btn-outline-primary2 + .language-btn {
  margin-left: 18px !important; /* spațiu confortabil față de stegulețe */
}

/* === UI/UX polish for auth pills (consistent size & feel) === */
.navbar.lx-navbar .btn-outline-primary2,
.navbar.lx-navbar .btn-primary2{
  min-width: 120px;                /* butoane mai aerisite */
  letter-spacing: 0.2px;           /* lizibilitate */
  line-height: 1.1 !important;     /* înălțime constantă */
}

.navbar.lx-navbar .btn-outline-primary2:active,
.navbar.lx-navbar .btn-primary2:active{
  transform: translateY(0) scale(.99); /* feedback la click */
  box-shadow: 0 0 0 rgba(0,0,0,0) !important;
}

@media (max-width: 991.98px){
  /* pe mobil rămân full-width, dar cu spațiu vertical mai generos */
  .navbar.lx-navbar .btn-outline-primary2,
  .navbar.lx-navbar .btn-primary2{
    margin: 8px 0 !important;
  }
}

/* On small screens they stack; add vertical rhythm and prevent touching */
@media (max-width: 991.98px){
  .navbar.lx-navbar .btn-outline-primary2,
  .navbar.lx-navbar .btn-primary2 {
    display: block !important;
    width: 100%;
    margin: 6px 0 !important; /* vertical spacing */
    text-decoration: none !important;
  }
}

/* === UI/UX WOW for Auth Pills (Log In / Sign Up) === */
/* Remove navbar underline effect for pill-buttons */
.navbar.lx-navbar .nav-link.btn-primary2::after,
.navbar.lx-navbar .nav-link.btn-outline-primary2::after { display: none !important; }

/* Base micro-interactions */
.navbar.lx-navbar .btn-primary2,
.navbar.lx-navbar .btn-outline-primary2{
  position: relative;              /* needed for shine */
  overflow: hidden;                /* clip shine */
  transform: translateZ(0);        /* enable GPU for smoother anims */
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

/* Icon nudge on hover for feedback */
.navbar.lx-navbar .btn-primary2 i,
.navbar.lx-navbar .btn-outline-primary2 i { transition: transform .18s ease, opacity .18s ease; }
.navbar.lx-navbar .btn-primary2:hover i,
.navbar.lx-navbar .btn-outline-primary2:hover i { transform: translateX(2px); }

/* Subtle lift + premium glow */
.navbar.lx-navbar .btn-primary2:hover,
.navbar.lx-navbar .btn-outline-primary2:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(212,165,107,.25), 0 2px 6px rgba(0,0,0,.08) !important;
}

/* Pressed state */
.navbar.lx-navbar .btn-primary2:active,
.navbar.lx-navbar .btn-outline-primary2:active{ transform: translateY(0); box-shadow: 0 2px 8px rgba(0,0,0,.12) !important; }

/* Focus ring consistent with theme */
.navbar.lx-navbar .btn-primary2:focus-visible,
.navbar.lx-navbar .btn-outline-primary2:focus-visible{
  outline: 2px solid rgba(212,165,107,.9) !important; outline-offset: 3px; box-shadow: none !important;
}

/* ⭐ Shine sweep effect */
.navbar.lx-navbar .btn-primary2::before,
.navbar.lx-navbar .btn-outline-primary2::before{
  content: ""; position: absolute; inset: -120% -40%;
  background: linear-gradient(75deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 65%);
  transform: translateX(-60%) skewX(-18deg);
  filter: blur(.5px);
  opacity: 0; pointer-events: none;
}
.navbar.lx-navbar .btn-primary2:hover::before,
.navbar.lx-navbar .btn-outline-primary2:hover::before{
  animation: pillShine 1.6s ease forwards;
}

@keyframes pillShine{
  0%{ transform: translateX(-65%) skewX(-18deg); opacity: 0; }
  25%{ opacity: .55; }
  100%{ transform: translateX(65%) skewX(-18deg); opacity: 0; }
}

/* Outline pill: add animated gradient border on hover */
.navbar.lx-navbar .btn-outline-primary2{
  background-clip: padding-box;    /* keep inner bg clean */
}
.navbar.lx-navbar .btn-outline-primary2:hover{
  border-color: transparent !important;
  background-image: linear-gradient(#fff,#fff), linear-gradient(90deg,#114949, #d4a56b, #114949);
  background-origin: border-box; background-clip: padding-box, border-box;
}

/* Solid gold pill: rich gradient on hover */
.navbar.lx-navbar .btn-primary2{
  background-image: linear-gradient(180deg, #d4a56b, #c19052) !important; /* subtle depth even at rest */
}
.navbar.lx-navbar .btn-primary2:hover{
  background-image: linear-gradient(180deg, #ddb274, #b78246) !important;
  filter: saturate(1.02);
  color: #fff !important;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .navbar.lx-navbar .btn-primary2,
  .navbar.lx-navbar .btn-outline-primary2,
  .navbar.lx-navbar .btn-primary2 i,
  .navbar.lx-navbar .btn-outline-primary2 i{ transition: none !important; }
  .navbar.lx-navbar .btn-primary2::before,
  .navbar.lx-navbar .btn-outline-primary2::before{ display:none !important; }
}





/* #################### */

/* === WOW EFFECT pentru butoanele din hero === */
.animated-button {
  position: relative;
  overflow: hidden;
  transition: all .25s ease;
  border-radius: 50px;
  font-weight: 600;
  letter-spacing: .3px;
  transform: translateZ(0);
}

/* Glow & lift on hover */
.animated-button:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,.12), 0 0 10px rgba(212,165,107,.4);
}

/* Shine effect */
.animated-button::before {
  content: "";
  position: absolute;
  top: -50%; left: -30%;
  width: 60%; height: 200%;
  background: linear-gradient(75deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 60%);
  transform: translateX(-120%) skewX(-18deg);
  opacity: 0;
  pointer-events: none;
}
.animated-button:hover::before {
  animation: heroBtnShine 1.8s ease forwards;
  opacity: 1;
}

@keyframes heroBtnShine {
  0%   { transform: translateX(-120%) skewX(-18deg); opacity: 0; }
  20%  { opacity: .55; }
  100% { transform: translateX(220%) skewX(-18deg); opacity: 0; }
}

/* Specific styles for each button */
.btn-tour {
  background: linear-gradient(180deg, #1c6f6f, #114949);
  color: #fff !important;
}
.btn-tour:hover { background: linear-gradient(180deg, #228888, #0d3b3b); }

.btn-work {
  background: linear-gradient(180deg, #7ca8a8, #7ca8a8);
  color: #fff !important;
}
.btn-work:hover { background: linear-gradient(180deg, #ddb274, #b78246); }

.btn-work-disabled {
  background: #ccc !important;
  color: #666 !important;
  cursor: not-allowed;
}

.btn-work2 {
  background: #ffffff !important;
  border: 2px solid #114949 !important;
  color: #114949 !important;
}
.btn-work:hover {
  background: #114949 !important;
}

.btn-work2-disabled {
  background: #ccc !important;
  color: #666 !important;
  cursor: not-allowed;
}


/*$$$$$*/

.btn-tour,.btn-work{min-height:44px; padding:.55rem 1rem; font-weight:600;}
.btn-work:hover{color:#fff !important;} /* ai deja asta, păstreaz-o */

.lx-hero .microcard{border-radius:14px; }
.lx-hero .row.g-4{--bs-gutter-x:1.25rem; --bs-gutter-y:1.25rem;}

:root{
  --elev-card: 0 10px 24px rgba(17,73,73,.08);
  --elev-hover:0 14px 28px rgba(17,73,73,.18);
}
.card,.lx-hero .microcard{box-shadow:var(--elev-card)!important;}
.card:hover,.lx-hero .microcard:hover{box-shadow:var(--elev-hover)!important;}

.navbar.lx-navbar .nav-link{color:#0f3d3d !important;}
.navbar.lx-navbar .nav-link:hover{ text-shadow:none; }




/* ================= HERO — WOW, dar curat & enterprise ================= */

/* 1) Ierarhie tipografică + lungime de rând lizibilă */
.lx-hero .hero-title,
.lx-hero .hero-subtitle,
.lx-hero .col-12.col-lg-6:first-child p{ max-width: 68ch; }

.lx-hero .hero-title{
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.15;
  margin-bottom: .5rem !important;
  /* accent discret sub titlu */
  position: relative;
}
.lx-hero .hero-title::after{
  content:"";
  position:absolute; left:0; bottom:-8px;
  width:72px; height:4px; border-radius:4px;
  background: linear-gradient(90deg,#114949,#d4a56b);
  box-shadow: 0 4px 12px rgba(17,73,73,.18);
}

.lx-hero .hero-subtitle{
  color:#0f3d3dcc;
  font-weight: 600;
  letter-spacing:.3px;
  margin-bottom:.75rem !important;
}

/* 2) Ritm vertical compact pentru copy */
.lx-hero .col-12.col-lg-6:first-child p{
  margin-bottom:.9rem;
  color: #184f4f;
}
.lx-hero .col-12.col-lg-6:first-child p strong{
  color:#0f3d3d; font-weight:700;
}

/* 3) CTA-uri coerente (fără a schimba HTML-ul) */
.lx-hero .col-12.col-lg-6:first-child .d-flex.flex-wrap.gap-2{ gap:12px !important; }

.lx-hero .btn-tour,
.lx-hero .btn-work,
.lx-hero .btn-work-disabled{
  min-height:44px; padding:.55rem 1rem; line-height:1.1;
  font-weight:600; border-radius:50px;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.lx-hero .btn-tour:hover,
.lx-hero .btn-work:hover{ color:#fff !important; transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(17,73,73,.18), 0 2px 6px rgba(0,0,0,.08);
}

/* 4) Micro-animare fină la încărcare (respectă reduced motion) */
@media (prefers-reduced-motion: no-preference){
  .lx-hero .hero-title{ animation: heroRise .45s ease-out both; }
  .lx-hero .hero-subtitle{ animation: heroRise .5s ease-out both .05s; }
  .lx-hero .col-12.col-lg-6:first-child p{ animation: heroRise .55s ease-out both .1s; }
  .lx-hero .col-12.col-lg-6:first-child .d-flex.flex-wrap.gap-2{ animation: heroRise .6s ease-out both .15s; }
}
@keyframes heroRise{
  from{ opacity:0; transform:translateY(8px) }
  to  { opacity:1; transform:translateY(0) }
}

/* 5) Cardul cu imagine – shadow mai soft, ca să nu concureze cu textul */
.lx-hero .lx-glass-card{ box-shadow: 0 10px 24px rgba(17,73,73,.10)!important; }

/* 6) Responsive finetune */
@media (min-width:992px){
  .lx-hero .hero-title{ font-size: clamp(2rem, 2.2vw + 1.2rem, 3rem); }
  .lx-hero .hero-subtitle{ font-size: clamp(1.05rem, .6vw + .8rem, 1.25rem); }
}
@media (max-width:991.98px){
  .lx-hero .hero-title{ font-size: 1.9rem; }
  .lx-hero .hero-subtitle{ font-size: 1.05rem; }
}

/* === Hero Title Accent Bar: Proportional + Animated === */
.lx-hero .hero-title {
  position: relative;
  display: inline-block; /* ca să se raporteze la text */
}

.lx-hero .hero-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  height: 4px;
  width: 0; /* start animat */
  border-radius: 999px;
  background: linear-gradient(90deg,#114949,#d4a56b);
  box-shadow: 0 4px 12px rgba(17,73,73,.18);
  animation: heroBarGrow .6s ease-out .1s forwards;
}

/* Keyframes pentru animatie */
@keyframes heroBarGrow {
  from { width: 0; opacity: .2; }
  to   { width: 40%; opacity: 1; } /* desktop target */
}

/* Mobil: mai scurtă și puțin mai subțire */
@media (max-width: 991.98px) {
  .lx-hero .hero-title::after {
    height: 3px;
    animation: heroBarGrowMobile .6s ease-out .1s forwards;
  }
  @keyframes heroBarGrowMobile {
    from { width: 0; opacity: .2; }
    to   { width: 28%; opacity: 1; }
  }
}


/* Logo sizing override (bate stilul inline) */
.lx-navbar .navbar-brand img{
  max-height: 80px !important;  /* crește mărimea pe desktop */
  height: auto;
  width: auto;
  transition: max-height .2s ease;
}

/* mobil: mai mic ca să nu rupă headerul */
@media (max-width: 575.98px){
  .lx-navbar .navbar-brand img{ max-height: 52px !important; }
}

/* când navbar-ul e „scrolled”, micșorează ușor */
.lx-navbar.lx-navbar-scrolled .navbar-brand img{
  max-height: 60px !important;
}

/* === Fix: Logout card header visibility & theme match === */
.card .card-header.bg-gradient-primary{
  /* override Bootstrap's cap background */
  background: linear-gradient(180deg, #114949, #0e3f3f) !important; /* deep teal */
  color: #fff !important;
  border-bottom: none !important;
}

/* Ensure rounded top corners for header when used inside cards */
.card .card-header.border-radius-lg{
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
}

/* Ensure rounded top corners for header when used inside cards */
.card .card-header.border-radius-lg{
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
}



/* === Manage Assistants – WOW card toggles + role badges === */
.assistants-list .assistant-item{
  display:flex; align-items:center; gap:12px;
  padding:.8rem 1rem; border:1px solid rgba(17,73,73,.08);
  border-radius:12px; margin-bottom:.6rem; /* visually card-like */
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}
.assistants-list .assistant-item:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(17,73,73,.12), 0 2px 6px rgba(0,0,0,.06);
  background: #ffffff;
}
/* highlight when checked */
.assistants-list .assistant-item:has(input:checked){
  border-color: #d4a56b;
  box-shadow: 0 10px 24px rgba(212,165,107,.18);
  background: linear-gradient(180deg,#ffffff, #fff8ef);
}
/* text column */
.assistants-list .assistant-text strong{ color:#0f3d3d; }
.assistants-list .assistant-text small{ color:#496969; }

/* role badge */
.badge-role{
  background: linear-gradient(90deg,#114949,#d4a56b);
  color:#fff; border:0; border-radius:999px; padding:.2rem .55rem; font-size:.75rem; font-weight:600;
}

/* move the checkbox to the right and style as a modern switch */
.assistants-list .assistant-toggle{ order:2; margin-left: 12px; }

/* custom switch styling (no extra HTML) */
.assistants-list .assistant-toggle{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  width: 46px; height: 26px; border-radius: 999px;
  background: #cfd8dc; position: relative; cursor: pointer;
  outline: none; border: none; transition: background .2s ease, box-shadow .2s ease;
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.04);
}
.assistants-list .assistant-toggle::after{
  content:""; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%;
  background:#fff; box-shadow: 0 2px 6px rgba(0,0,0,.18);
  transition: transform .2s ease;
}
.assistants-list .assistant-toggle:checked{ background: linear-gradient(90deg,#114949,#d4a56b); }
.assistants-list .assistant-toggle:checked::after{ transform: translateX(20px); }
.assistants-list .assistant-toggle:focus-visible{ outline:2px solid rgba(212,165,107,.85); outline-offset:2px; }

/* reduce default list-group borders for a cleaner look */
.assistants-list .list-group-item{ border: none; }

/* fallback if :has is not supported – subtle accent when focused */
@supports not selector(:has(*)){
  .assistants-list .assistant-item:focus-within{ border-color:#d4a56b; box-shadow: 0 6px 18px rgba(212,165,107,.16); }
}




/* 1) Toggle mai „solid” (off mai vizibil) */
.assistants-list .assistant-toggle{ background:#dfe6e9; }
.assistants-list .assistant-item:hover .assistant-toggle{ box-shadow: inset 0 0 0 2px rgba(0,0,0,.06); }

/* 2) Densitate puțin mai mare (spațiu vertical mai mic) */
.assistants-list .assistant-item{ padding:.7rem .95rem; }

/* 3) Badge mai „chip” (uppercase + tracking mic) */
.badge-role{
  text-transform: uppercase;
  letter-spacing:.3px;
  padding:.16rem .55rem;
  font-size:.72rem;
}


/* === Profile Avatar Styling === */
.profile-avatar {
  width: 96px !important;
  height: 96px !important;
  max-width: none !important;  /* nu se mai întinde full-width */
  flex: 0 0 auto;
  object-fit: cover;
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0,0,0,.15), 0 0 0 3px rgba(17,73,73,.35);
  transition: transform .22s ease, box-shadow .22s ease;
}
.profile-avatar:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.22), 0 0 0 4px rgba(212,165,107,.55);
}


/* === Profile Avatar Fallback (iconic by role) — refined, professional === */
.profile-avatar-fallback {
  position: relative;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1b4f4f, #0f3f3f); /* calm teal base */
  border: 2px solid #fff; /* crisp inner ring */
  box-shadow: 0 6px 18px rgba(17,73,73,.18), 0 0 0 3px rgba(17,73,73,.22), inset 0 1px 0 rgba(255,255,255,.35);
  transition: transform .16s ease, box-shadow .2s ease, filter .2s ease;
  -webkit-font-smoothing: antialiased; /* crisper icon */
}
.profile-avatar-fallback i{ font-size: 40px; color: #fff; line-height: 1; }
.profile-avatar-fallback:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(17,73,73,.22), 0 0 0 3px rgba(212,165,107,.28), inset 0 1px 0 rgba(255,255,255,.4);
  filter: saturate(1.02);
}
/* Subtle role dot */
/* Role variants */
.profile-avatar-fallback.avatar-staff { background: linear-gradient(135deg,#0f3d3d,#136666); }
.profile-avatar-fallback.avatar-staff i{ color:#ffcc00; }
.profile-avatar-fallback.avatar-staff::after{ background:#0ea5a5; }

.profile-avatar-fallback.avatar-beta { background: linear-gradient(135deg,#f3e7c9,#d9b670); }
.profile-avatar-fallback.avatar-beta i{ color:#114949; }
.profile-avatar-fallback.avatar-beta::after{ background:#d4a56b; }

.profile-avatar-fallback.avatar-user { background: linear-gradient(135deg,#cfd8dc,#b0bec5); }
.profile-avatar-fallback.avatar-user i{ color:#ffffff; }
.profile-avatar-fallback.avatar-user::after{ background:#95a5a6; }

/* upscale on large screens for presence */
@media (min-width: 992px) {
  .profile-avatar-fallback { width: 110px !important; height: 110px !important; }
  .profile-avatar-fallback i{ font-size: 48px; }
}

/* === Avatar WOW: conic ring + gentle spin (respects reduced motion) === */
.profile-avatar-fallback{ isolation:isolate; }
.profile-avatar-fallback::before{
  content:""; position:absolute; inset:-4px; border-radius:50%; z-index:-1;
  background: conic-gradient(from 0deg, #d4a56b, #114949, #d4a56b);
  filter: blur(.6px) saturate(1.05);
  opacity: .75;
  transition: opacity .25s ease, transform .25s ease, filter .25s ease;
}
.profile-avatar-fallback:hover::before{ opacity: .95; filter: saturate(1.08); }
@media (prefers-reduced-motion: no-preference){
  .profile-avatar-fallback::before{ animation: ringSpin 12s linear infinite; }
}
@keyframes ringSpin{ to{ transform: rotate(360deg); } }

/* === Name line: role chip next to the name (subtle, enterprise) === */


/* === Case Card Polished UI === */
.case-card{ display:flex; flex-direction:column; min-height:210px; }
.case-card__header{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:.5rem; }
.case-card__meta{ display:flex; flex-wrap:wrap; gap:.5rem; margin:.25rem 0 .5rem; }
.meta-chip{ display:inline-flex; align-items:center; gap:.4rem; padding:.25rem .55rem; border-radius:999px; font-size:.85rem; background:rgba(17,73,73,.06); color:#114949; border:1px solid rgba(17,73,73,.08); }
.status-pill{ padding:.18rem .55rem; border-radius:999px; font-size:.75rem; font-weight:600; letter-spacing:.2px; }
.status-pill--readonly{ background:#f1f3f5; color:#5f6b76; border:1px solid #e6eaee; }
.case-card__desc{ color:#4b6666; margin-bottom: .75rem; }
.desc-clamp{ display:-webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow:hidden; }
.case-card__footer{ margin-top:auto; display:flex; justify-content:flex-end; }

/* Hover accent for the whole card */
.card.shadow-primary:hover{
  transform: translateY(-2px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  box-shadow: 0 10px 22px rgba(17,73,73,.12), 0 2px 6px rgba(0,0,0,.06);
  border-color: rgba(17,73,73,.2);
}



/* === Case Folders 2-column layout helpers === */
.case-scroll{
  max-height: 72vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: .25rem; /* mic spacing pt scrollbar */
}
.case-scroll::-webkit-scrollbar{ width: 10px; }
.case-scroll::-webkit-scrollbar-thumb{
  background: rgba(17,73,73,.25);
  border-radius: 8px;
}
.case-scroll:hover::-webkit-scrollbar-thumb{
  background: rgba(17,73,73,.4);
}

/* Sidebar fix sub navbar; ajustează dacă navbarul are altă înălțime */
.sidebar-sticky{ position: sticky; top: 84px; }

/* Consistență pe înălțimea cardurilor din grid (≈4 vizibile: 2x2) */
.case-card{ min-height: 180px; }


.btn-dashboard {
  background: linear-gradient(90deg, #114949, #c99846);
  color: #fff;
  border: none;
  border-radius: 50px;
  padding: 0.6rem 1.5rem;
  font-weight: 600;
  transition: all 0.4s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

.btn-dashboard:hover {
  background: linear-gradient(90deg, #c99846, #114949);
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.2);
  color: #fff;
}




/* Page title styling (keeps H1 outside of cards) */
  .page-title{ text-align:center; margin-bottom: .5rem; }
  .page-subtitle{ text-align:center; color:#6c7a7a; margin-bottom: 1.25rem; }
  .page-title::after{
    content:"";
    display:block;
    width: 120px; height: 3px; margin:.6rem auto 0;
    background: linear-gradient(90deg,#114949,#d4a56b);
    border-radius: 2px;
  }

  /* Only the form card is scroll-managed on low-height screens */
  .vs-form{ display:flex; flex-direction:column; max-height: calc(100vh - 140px); }
  .vs-form .card-header{ flex:0 0 auto; }
  .vs-form .card-body{ flex:1 1 auto; padding-bottom: 2rem; overflow-y: auto; }


  /* ===== Save buttons (Threads): compact mobile-first cards (refined & elegant) ===== */
  :root {
    --save-pdf-bg:   #fdecec;    /* soft red tint */
    --save-pdf-text: #B71C1C;
    --save-pdf-brd:  #E57373;
    --save-doc-bg:   #e8f4f2;    /* soft teal tint */
    --save-doc-text: #00695C;
    --save-doc-brd:  #4DB6AC;
    --save-muted:    #E0E0E0;
  }
  .save-group { gap: .5rem; flex-wrap: wrap; }
  .btn-save-threads {
    border-radius: 8px;
    border: 1px solid transparent;
    padding: .3rem .5rem; /* smaller */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .25rem; /* tighter */
    min-width: 90px; /* smaller */
    text-align: center;
    font-weight: 600;
    letter-spacing: .2px;
    transition: all .25s ease;
    text-decoration: none !important;
    color: inherit !important;            /* prevent blue text on hover */
    background: #fff;
    font-size: .85rem; /* smaller text */
  }
  .btn-save-threads .ftype { font-size: .85rem; line-height: 1; }
  /* remove vlabel styling to avoid tag look */
  /* color by file type, with soft gradient backgrounds */
  .btn-save-threads[data-file="pdf"]  {
    background: linear-gradient(180deg,#fdecec,#f8dcdc);
    color: var(--save-pdf-text) !important;
    border-color: var(--save-pdf-brd);
  }
  .btn-save-threads[data-file="docx"] {
    background: linear-gradient(180deg,#e8f4f2,#d9efec);
    color: var(--save-doc-text) !important;
    border-color: var(--save-doc-brd);
  }
  /* hover/active (only when enabled) */
  .btn-save-threads:hover:not(.disabled) {
    box-shadow: 0 4px 10px rgba(0,0,0,.12);
    transform: scale(1.03);
    transition: all .25s ease;
  }
  .btn-save-threads:active:not(.disabled) { transform: scale(.98); filter: brightness(.98); }
  .btn-save-threads:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(17,73,73,.22); }
  /* disabled, but still readable */
  .btn-save-threads.disabled, .btn-save-threads[aria-disabled="true"] {
    filter: grayscale(.35) contrast(.95);
    cursor: not-allowed !important;
    opacity: 1 !important;
  }
  /* Mobile: Save buttons fit all on one line, smaller, pastel, no scroll */
  @media (max-width: 576px) {
    .save-group {
      display: flex;
      flex-wrap: nowrap;     /* one line */
      overflow-x: hidden;    /* no scroll */
      gap: .25rem;
      width: 100%;
    }
    .btn-save-threads {
      flex: 1 1 0;           /* 4 buttons share the row equally */
      min-width: 0;          /* allow shrinking */
      min-height: 34px;      /* smaller height */
      padding: .2rem .35rem; /* tighter padding */
      font-size: .72rem;     /* smaller text */
      border-radius: 6px;    /* a bit tighter radius */
      box-shadow: none;      /* calmer on mobile */
      transform: none;       /* avoid jumpy hover on touch */
    }
    .btn-save-threads .ftype  { font-size: .78rem; }
    .btn-save-threads .vlabel { display: none; } /* hide secondary line on mobile */

    /* Softer pastel variants on mobile (solid, high readability) */
    .btn-save-threads[data-file="pdf"]  {
      background: #fff5f6;           /* lighter pastel red */
      color: #8a2a2a !important;     /* readable but muted */
      border-color: #f2c6c6;
    }
    .btn-save-threads[data-file="docx"] {
      background: #f2fbf9;           /* lighter pastel teal */
      color: #1f665f !important;     /* readable but muted */
      border-color: #bfe3dc;
    }

    /* keep hover subtle if any */
    .btn-save-threads:hover:not(.disabled) { box-shadow: 0 2px 6px rgba(0,0,0,.10); transform: none; }
  }
  /* Desktop: allow single-line layout if space permits */
  @media (min-width: 768px) {
    .btn-save-threads { flex-direction: row; gap: .4rem; padding: .45rem .8rem; }
    .btn-save-threads .ftype { font-size: .85rem; }
    /* .vlabel rule removed */
  }

  /* ==== Animated Thinking Placeholder ==== */
  .thinking-wrap {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
  }
  .thinking-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .5rem;
    border-radius: 9999px;
    background: #eef7f5; /* subtle teal-tinted */
    color: #0f766e;      /* teal text */
    font-weight: 600;
    font-size: .85rem;
    line-height: 1;
  }
  .thinking-dots {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-left: .1rem;
  }
  .thinking-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0f766e;
    opacity: .4;
    animation: thinking-bounce 1.2s infinite ease-in-out;
  }
  .thinking-dot:nth-child(2) { animation-delay: .15s; }
  .thinking-dot:nth-child(3) { animation-delay: .3s; }

  @keyframes thinking-bounce {
    0%, 80%, 100% { transform: translateY(0); opacity: .35; }
    40% { transform: translateY(-4px); opacity: .9; }
  }

  /* Reduced motion: keep it calm */
  @media (prefers-reduced-motion: reduce) {
    .thinking-dot { animation: none; opacity: .6; }
  }



  /* ==== Animated Thinking Placeholder ==== */
  .thinking-wrap {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
  }
  .thinking-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .5rem;
    border-radius: 9999px;
    background: #eef7f5; /* subtle teal-tinted */
    color: #0f766e;      /* teal text */
    font-weight: 600;
    font-size: .85rem;
    line-height: 1;
  }
  .thinking-dots {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-left: .1rem;
  }
  .thinking-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0f766e;
    opacity: .4;
    animation: thinking-bounce 1.2s infinite ease-in-out;
  }
  .thinking-dot:nth-child(2) { animation-delay: .15s; }
  .thinking-dot:nth-child(3) { animation-delay: .3s; }

  @keyframes thinking-bounce {
    0%, 80%, 100% { transform: translateY(0); opacity: .35; }
    40% { transform: translateY(-4px); opacity: .9; }
  }

  /* Reduced motion: keep it calm */
  @media (prefers-reduced-motion: reduce) {
    .thinking-dot { animation: none; opacity: .6; }
  }

  /* ==== Icon Button Group — refined UI/UX ==== */
  .icon-button-group {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
  }
  .icon-button-group .icon-btn {
    /* consistent touch target and square shape */
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid #e5e7eb;         /* light border */
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16,24,40,.06);
    transition: background-color .2s ease, box-shadow .25s ease, transform .05s ease, border-color .2s ease;
    text-decoration: none !important;
    line-height: 1;
    font-size: 1.1rem;                  /* emoji/icon size */
    color: #334155;                     /* slate-700 */
  }
  .icon-button-group .icon-btn:hover {
    background: #f4f8f7;                /* subtle teal-tinted hover */
    border-color: #d7e6e3;
    box-shadow: 0 2px 6px rgba(16,24,40,.12);
    transform: translateY(-1px);
    color: #245c55;                     /* darker teal-ish */
  }
  .icon-button-group .icon-btn:active { transform: translateY(0); }
  .icon-button-group .icon-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0,121,107,.25), 0 2px 6px rgba(16,24,40,.12);
    border-color: #9fd4cb;
  }
  .icon-button-group .icon-btn[disabled],
  .icon-button-group .icon-btn.disabled {
    cursor: not-allowed;
    opacity: .55;
    filter: grayscale(.3);
    background: #fafafa;
  }
  /* Compact variant when space is tight */
  @media (max-width: 576px) {
    .icon-button-group {
      gap: .3rem;
    }
    .icon-button-group .icon-btn {
      width: 38px;
      height: 38px;
      font-size: 1rem;
      border-radius: 8px;
    }
  }


  
  /* Keep CTA visible on active cards */
  .assistant-card:not(.disabled-assistant) .assistant-info .btn{
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
  /* Nice hover lift without hiding it */
  .assistant-card:not(.disabled-assistant):hover .assistant-info .btn{
    box-shadow: 0 4px 14px rgba(17,73,73,.25);
    transform: translateY(-1px);
  }
  /* Make sure the CTA is on top of any overlays/images */
  .assistant-card .assistant-info{ position: relative; z-index: 2; }
  .assistant-card .assistant-img{ pointer-events: none; }
    /* Disabled assistants: keep button visible but inactive */
  .assistant-card.disabled-assistant .assistant-info .btn{
    opacity: .45 !important;
    pointer-events: none;
  }






/* === Assistants CTA – Professional variant (btn-pro-work) === */
.btn-pro-work {
  background: linear-gradient(180deg, #166d6d, #114949) !important; /* deep teal */
  border: 1.5px solid #0e3f3f !important;
  color: #fff !important;
  border-radius: 999px !important; /* pill */
  padding: .5rem 1rem !important;
  font-weight: 700 !important;
  letter-spacing: .2px;
  box-shadow: 0 6px 16px rgba(17,73,73,.22), 0 2px 6px rgba(0,0,0,.08) !important;
  transition: background .22s ease, border-color .22s ease, transform .12s ease, box-shadow .22s ease !important;
  text-decoration: none !important;
}
.btn-pro-work:hover {
  background: linear-gradient(180deg, #1b7f7f, #0f3d3d) !important;
  border-color: #0f3d3d !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(17,73,73,.28), 0 4px 10px rgba(0,0,0,.10) !important;
  color: #fff !important;
}
.btn-pro-work:active {
  transform: translateY(0) scale(.99);
  box-shadow: 0 3px 8px rgba(0,0,0,.14) !important;
}
.btn-pro-work:focus-visible {
  outline: 2px solid rgba(212,165,107,.85) !important; /* gold ring */
  outline-offset: 3px; box-shadow: none !important;
}

/* Disabled state */
.btn-pro-work-disabled,
.btn-pro-work:disabled {
  background: #eef2f1 !important;
  color: #7b8d8b !important;
  border: 1.5px dashed #c9d6d4 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
}




/* === Assistant Hashtags === */
.assistant-hashtags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.4rem;
}

.assistant-hashtags .hashtag {
  font-size: 0.78rem;
  font-weight: 600;
  color: #114949;
  background: rgba(17,73,73,0.08);
  border: 1px solid rgba(17,73,73,0.12);
  padding: 3px 7px;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.assistant-hashtags .hashtag:hover {
  background: rgba(17,73,73,0.15);
  border-color: rgba(17,73,73,0.2);
  transform: translateY(-1px);
}

/* === Assistant Cards: Compact, airier, calmer === */
.assistant-card.is-compact {
  background: #fff;
  border: 1px solid rgba(17,73,73,.10);
  box-shadow: 0 10px 30px rgba(17,73,73,.8); /* umbră mai intensă */
  padding: 16px 18px;
  min-height: 132px;
  gap: 12px;
  transition: all 0.25s ease-in-out; /* animatie la hover */
}

.assistant-card.is-compact:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 28px rgba(17,73,73,.6); /* umbră mai profundă la hover */
  background: #fff;
  transition: all 0.25s ease-in-out;
}
/* Header row: name at left, CTA at right */
.assistant-card.is-compact .assistant-head{
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; margin-bottom: .35rem;
}
/* Typography & hierarchy */
.assistant-card.is-compact .assistant-name{ font-size: 1.15rem; font-weight: 800; color:#0f3d3d; }
.assistant-card.is-compact .assistant-title{ font-size: .9rem; color:#597777; }
.assistant-card.is-compact .assistant-description{
  color:#4b6666; font-size:.92rem; max-width: 100%;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* CTA: smaller pill */
.assistant-card.is-compact .btn-dashboard{ padding: .35rem .8rem; font-size:.85rem; border-radius:999px; white-space: nowrap; }
/* Image: smaller, calmer border */
.assistant-card.is-compact .assistant-img{ width: 84px; height: 84px; border-radius: 12px; border: 1px solid rgba(17,73,73,.10); }
/* Hashtags: show max 3, smaller chips */
.assistant-card.is-compact .tag-row{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.35rem; }
.assistant-card.is-compact .tag-row .hashtag{ font-size:.72rem; padding:2px 6px; border-radius:999px; background:rgba(17,73,73,.06); border:1px solid rgba(17,73,73,.10); color:#114949; }
.assistant-card.is-compact .tag-row .hashtag:nth-child(n+6){ display:none; }
/* Mobile tweaks */
@media (max-width: 768px){
  .assistant-card.is-compact{ padding:14px 14px; min-height: 120px; }
  .assistant-card.is-compact .assistant-img{ width:72px; height:72px; }
  .assistant-card.is-compact .assistant-name{ font-size:1.05rem; }
}





/*copied from chat*/
  /* === Save toolbar — per-button glossy ivory pills (no shared bg), refined visibility === */
  .save-group{ display:flex; align-items:center; gap:.45rem; padding:0; background:transparent; border:0; box-shadow:none; }
  .save-sep{ width:16px; height:2px; background:rgba(255,255,255,.48); border-radius:2px; display:inline-block; }
  .save-caption{ display:none; }

  .save-btn{
    position:relative; --pad-x:.74rem; --pad-y:.40rem;
    padding:var(--pad-y) var(--pad-x); border-radius:999px; font-size:.86rem; line-height:1;
    display:inline-flex; align-items:center; gap:.40rem; text-decoration:none;
    background: linear-gradient(180deg, rgba(255,255,240,.32), rgba(255,255,240,.18));
    border:1.25px solid rgba(255,255,240,.55);
    box-shadow: 0 1px 0 rgba(255,255,255,.28) inset, 0 3px 10px rgba(0,0,0,.18);
    color:#114949; transition: transform .08s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
  }
  .save-btn .ftype,.save-btn .vlabel{ color:inherit; }
  .save-btn .ftype{ font-weight:800; letter-spacing:.02em; }
  .save-btn .vlabel{ font-weight:600; opacity:.92; }

  .save-btn.is-enabled{
    background: linear-gradient(180deg, rgba(255,255,240,.48), rgba(255,255,240,.26));
    border-width: 1.4px;
    box-shadow: 0 1px 0 rgba(255,255,255,.38) inset, 0 6px 14px rgba(0,0,0,.20);
    color:#0d3c3c;
  }
  .save-btn[data-file="pdf"]{ border-color: rgba(122,0,42,.45); }
  .save-btn[data-file="docx"]{ border-color: rgba(17,73,73,.45); }
  .save-btn.is-enabled[data-file="pdf"]{ border-color: rgba(122,0,42,.75); }
  .save-btn.is-enabled[data-file="docx"]{ border-color: rgba(17,73,73,.75); }

  .save-btn.is-enabled:hover{
    background: linear-gradient(180deg, rgba(255,255,240,.60), rgba(255,255,240,.34));
    transform: translateY(-1px);
    box-shadow: 0 1px 0 rgba(255,255,255,.42) inset, 0 9px 18px rgba(0,0,0,.24);
  }
  .save-btn.is-enabled:focus{ outline:3px solid rgba(17,73,73,.35); outline-offset:2px; }

  /* Color accents ONLY on the file label */
  .save-btn[data-file="pdf"] .ftype { color:#7a002a; }   /* burgundy */
  .save-btn[data-file="docx"] .ftype{ color:#114949; }   /* green */

  /* Hover & focus */
  .save-btn:hover{
    background: linear-gradient(180deg, rgba(255,255,240,.56), rgba(255,255,240,.32));
    transform: translateY(-1px);
    box-shadow: 0 1px 0 rgba(255,255,255,.45) inset, 0 10px 18px rgba(0,0,0,.24);
  }
  .save-btn:focus{ outline:3px solid rgba(255,255,255,.6); outline-offset:2px; }

  /* Disabled — readable but muted */
  .save-btn.disabled, .save-btn.disabled:hover{
    background: linear-gradient(180deg, rgba(255,255,240,.20), rgba(255,255,240,.12));
    color: #7f9494;
    border-color: rgba(255,255,240,.35);
    box-shadow: none; transform: none;
  }
  .save-btn.disabled .ftype{ color:#95a8a8; }

  /* Tooltip per button (uses title attr) */
  .save-btn::after{ content: attr(title); position:absolute; left:50%; bottom:calc(100% + 6px);
    transform:translateX(-50%) translateY(2px); background:rgba(0,0,0,.86); color:#fff; font-size:.74rem; line-height:1;
    padding:.32rem .5rem; border-radius:.35rem; white-space:nowrap; opacity:0; pointer-events:none;
    transition: opacity .15s ease, transform .15s ease; box-shadow:0 4px 10px rgba(0,0,0,.3); }
  .save-btn:hover::after{ opacity:1; transform:translateX(-50%) translateY(0); }
  .save-btn::before{ content:""; position:absolute; left:50%; bottom:100%; transform:translateX(-50%);
    border:6px solid transparent; border-top-color:rgba(0,0,0,.86); opacity:0; transition:opacity .15s ease; }
  .save-btn:hover::before{ opacity:1; }

  /* Mobile compact */
  @media (max-width:576px){ .save-group{ flex-wrap:wrap; gap:.3rem; } .save-sep{ display:none; } .save-btn{ font-size:.82rem; --pad-x:.62rem; --pad-y:.34rem; } }



  /* Context on dark header */
  .card-header.bg-gr .save-group{ background:transparent; border:none; }
  .card-header.bg-gr .save-sep{ background:rgba(255,255,255,.48); }

  /* === Prompter layout fixes === */
  .custom-textarea-wrapper{
  position: relative;
  /* control sizes from here */
  --icon-size: 26px;     /* mai mic decât 28px */
  --icon-gap: 8px;
  --icon-pad: 12px;
}

.custom-scrollable-textarea{
  min-height: 136px;
  line-height: 1.5;
  padding: 12px 14px;   /* standard padding, no overlay spacing needed */
  resize: vertical;
  display: block;
  width: 100%;
}

.icon-button-group{
  position: static;              /* no absolute overlay */
  display: flex;
  justify-content: flex-end;     /* align to the right edge */
  align-items: center;
  gap: var(--icon-gap);
  flex-wrap: wrap;               /* wrap on narrow screens */
  margin-top: 8px;               /* space below textarea */
  z-index: 1;
}

.icon-btn{
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--icon-size); height: var(--icon-size); border-radius: 8px;
  border: 1px solid rgba(17,73,73,.28);
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
  transition: transform .08s ease, box-shadow .15s ease, background .15s ease;
  font-size: calc(var(--icon-size) * 0.52);
  line-height: 1;
}

  .icon-btn:hover{ transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0,0,0,.12); }
  .icon-btn:active{ transform: translateY(0); }

  @media (max-width: 576px){
  .custom-textarea-wrapper{ --icon-size: 24px; --icon-gap: 6px; --icon-pad: 10px; }
  .icon-button-group{ flex-wrap: wrap; }

  .custom-scrollable-textarea{
    min-height: 130px;
    padding: 12px;
  }
}

  /* floating label position so it doesn't overlap icons */
  .floating-label{
    position: absolute; left: 14px; top: 12px;
    color: #6c757d; background: transparent; pointer-events: none;
    transition: all .15s ease;
    display: block; opacity: .9; z-index: 1; /* make sure it shows until focus */
  }
/* copied from chat - end */


/* Sidebar Actions – tipografie și affordance */
.panel-actions .btn{ font-size:.95rem; letter-spacing:.2px; }
.panel-actions .btn i{ margin-right:.45rem; font-size:1.05em; line-height:1; }

/* Să arate ‘buton’, nu link, pe ivory */
.btn-teal-outline, .btn-burgundy-outline{ background-clip: padding-box; }
.btn{ text-decoration:none !important; }

/* === Unified App Buttons (pill shape, pro look) === */
.btn-teal{
  background:#114949; color:#fff !important; border:1px solid #114949;
  border-radius:25px; padding:.55rem 1rem; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; text-decoration:none !important; transition:all .22s ease;
}
.btn-teal:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(17,73,73,.18); }
.btn-teal:disabled,.btn-teal.disabled{ opacity:.55; cursor:not-allowed; box-shadow:none; transform:none; }

.btn-teal-outline{
  background:#fff; color:#114949 !important; border:2px solid #114949;
  border-radius:25px; padding:.55rem 1rem; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; text-decoration:none !important; transition:all .22s ease;
  box-shadow:0 4px 8px rgba(0,0,0,.06);
}
.btn-teal-outline:hover{ background:#114949; color:#fff !important; box-shadow:0 10px 22px rgba(17,73,73,.18); transform:translateY(-2px); }
.btn-teal-outline:disabled,.btn-teal-outline.disabled{ background:#fff; color:#8aa2a2 !important; border-color:#cfd8dc; box-shadow:none; transform:none; }

.btn-burgundy-outline{
  background:#fff; color:#7a002a !important; border:2px solid #7a002a;
  border-radius:25px; padding:.55rem 1rem; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; text-decoration:none !important; transition:all .22s ease;
  box-shadow:0 4px 8px rgba(0,0,0,.06);
}
.btn-burgundy-outline:hover{ background:#7a002a; color:#fff !important; box-shadow:0 10px 22px rgba(122,0,42,.18); transform:translateY(-2px); }
.btn-burgundy-outline:disabled,.btn-burgundy-outline.disabled{ background:#fff; color:#a87487 !important; border-color:#d8b6bd; box-shadow:none; transform:none; }

/* Ensure any .btn link never looks like plain link */
.btn{ text-decoration:none !important; }
/* === Sidebar Actions: reliable vertical spacing between buttons === */
.panel-actions{ display:grid; gap:12px; grid-auto-rows:minmax(44px, auto); }
.panel-actions .btn{ margin:0 !important; width:100%; }
/* === Case Card final polish: tighter chips, aligned buttons, cleaner header === */
.case-card__header h5{ margin:0; font-weight:800; color:#0f3d3d; }

/* Chips smaller and calmer */
.case-card .meta-chip{ font-size:.8rem; padding:.22rem .5rem; background:rgba(17,73,73,.05); border:1px solid rgba(17,73,73,.12); }
.case-card .meta-chip i{ opacity:.7; font-size:.95em; }

/* Footer: consistent spacing & alignment */
.case-card__footer{ margin-top: .75rem; display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:flex-start; }
.case-card__footer .btn{ line-height:1.1; }

/* Match heights between solid & outline buttons inside case cards */
.case-card__footer .btn.btn-teal{ border-width:2px; }

/* Slightly soften the card shadow on hover inside case grid */
.card.shadow-primary{ box-shadow: 0 10px 24px rgba(17,73,73,.10) !important; }
.card.shadow-primary:hover{ box-shadow: 0 14px 28px rgba(17,73,73,.16) !important; }
/* === FIX: Solid teal buttons turning white on hover (force solid state) === */
.btn-teal,
.btn-teal:hover,
.btn-teal:focus,
.btn-teal:active{
  background:#114949 !important;
  border-color:#114949 !important;
  color:#fff !important;
  background-image:none !important;
}
/* === Unified Case Detail Buttons (consistent professional look) === */
.case-action-bar{ display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-start; align-items:center; }
.case-action-bar .btn{ border-radius:25px; font-weight:700; font-size:.95rem; padding:.55rem 1.2rem; min-height:44px; display:inline-flex; align-items:center; gap:.45rem; text-decoration:none !important; transition:all .22s ease; }

/* Neutral (teal-outline) style for most actions */
.case-action-bar .btn-outline-teal{ background:#fff; color:#114949 !important; border:2px solid #114949; box-shadow:0 4px 8px rgba(0,0,0,.05); }
.case-action-bar .btn-outline-teal:hover{ background:#114949; color:#fff !important; transform:translateY(-2px); box-shadow:0 10px 22px rgba(17,73,73,.18); }

/* Delete (danger-outline) */
.case-action-bar .btn-outline-danger{ background:#fff; color:#7a002a !important; border:2px solid #7a002a; box-shadow:0 4px 8px rgba(0,0,0,.05); }
.case-action-bar .btn-outline-danger:hover{ background:#7a002a; color:#fff !important; transform:translateY(-2px); box-shadow:0 10px 22px rgba(122,0,42,.18); }

/* Primary (solid teal) for Back/Submit type */
.case-action-bar .btn-primary-solid{ background:#114949; color:#fff !important; border:2px solid #114949; box-shadow:0 4px 8px rgba(0,0,0,.06); }
.case-action-bar .btn-primary-solid:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(17,73,73,.18); }

/* Icon alignment */
.case-action-bar .btn i{ font-size:1rem; }
/* === PRICING PAGE — Super Profi & WOW === */
.pricing-hero{ text-align:center; margin-bottom: 1.25rem; }
.pricing-hero h1{ font-weight: 800; letter-spacing:.2px; margin-bottom:.35rem; }
.pricing-hero p{ color:#496969; margin:0 auto .5rem; max-width: 72ch; }
.pricing-hero h1::after{ content:""; display:block; width:120px; height:3px; margin:.6rem auto 0; border-radius:2px; background:linear-gradient(90deg,#114949,#d4a56b); box-shadow:0 4px 12px rgba(17,73,73,.18); }

/***** Card *****/
.pricing-card{ position:relative; border-radius:16px !important; border:1px solid rgba(17,73,73,.10) !important; box-shadow:0 12px 28px rgba(17,73,73,.10) !important; transition:transform .22s ease, box-shadow .22s ease; }
.pricing-card:hover{ transform:translateY(-4px); box-shadow:0 16px 32px rgba(17,73,73,.16) !important; }

/* plan/top bar */
.pricing-card .pricing-top{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.35rem; }
.pricing-card .pricing-name{ font-weight:800; color:#0f3d3d; margin:0; }
.pricing-card .pricing-badge{ border-radius:999px; font-weight:700; }

/* price */
.pricing-card .pricing-price{ display:flex; align-items:baseline; gap:.35rem; margin:.25rem 0 .5rem; }
.pricing-card .pricing-amount{ font-size:1.6rem; font-weight:800; color:#114949; }
.pricing-card .pricing-cycle{ color:#6b8080; }

/* conversion & flags */
.pricing-card .pricing-sub{ color:#6b8080; font-size:.9rem; }

/* resources table */
.pricing-card table{ border-radius:12px; overflow:hidden; }
.pricing-card thead th{ background:#f6faf9 !important; color:#0f3d3d; font-weight:700; border-bottom:1px solid rgba(17,73,73,.12) !important; }
.pricing-card tbody td{ border-top:1px solid rgba(17,73,73,.06) !important; }
.pricing-card tbody tr:hover{ background:rgba(17,73,73,.03); }

/* footer CTA */
.pricing-card .pricing-cta{ margin-top:auto; padding-top:.75rem; }

/* ribbons */
.pricing-card .ribbon{ position:absolute; top:12px; right:-8px; background:linear-gradient(90deg,#114949,#1e6f6f); color:#fff; font-weight:800; font-size:.72rem; padding:.25rem .55rem; border-radius:999px; box-shadow:0 6px 14px rgba(0,0,0,.12); }
.pricing-card.is-popular .ribbon{ right:auto; left:12px; background:linear-gradient(90deg,#d4a56b,#b78246); }

/* secondary section spacing */
.pricing-section + .pricing-section{ margin-top: 2rem; }
/* === Pricing: Summary/Details toggle (readable cards) === */
.pricing-card .plan-summary{ margin:.25rem 0 .35rem; }
.pricing-card .plan-summary ul{ padding-left: 0; margin:0; list-style: none; }
.pricing-card .plan-summary li{ display:flex; align-items:center; gap:.4rem; color:#184f4f; }
.pricing-card .plan-summary li::before{ content:"✔"; font-weight:800; color:#114949; }

.pricing-card .toggle-details{
  background: transparent; border:0; color:#114949; font-weight:700; letter-spacing:.2px;
  display:inline-flex; align-items:center; gap:.35rem; padding:.25rem 0; cursor:pointer;
}
.pricing-card .toggle-details:hover{ text-decoration: underline; }
.pricing-card .toggle-details .chev{ transition: transform .22s ease; }
.pricing-card.expanded .toggle-details .chev{ transform: rotate(180deg); }

/* Collapsible details area */
.pricing-card .plan-details{ position:relative; max-height:0; overflow:hidden; transition:max-height .28s ease; }
/* Faded edge when collapsed */
.pricing-card .plan-details::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:26px;
  background: linear-gradient(180deg, rgba(255,255,240,0), rgba(255,255,240,1));
  opacity: 1; pointer-events:none;
}
.pricing-card.expanded .plan-details{ max-height: 1200px; } /* large enough for table */
.pricing-card.expanded .plan-details::after{ display:none; }

/* === Profile Monogram Badge (replaces round avatar) === */
.profile-badge{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.4rem .75rem; border-radius:14px;
  background: linear-gradient(180deg,#ffffff,#faf7ef);
  border:1px solid rgba(17,73,73,.14);
  box-shadow: 0 8px 18px rgba(17,73,73,.08);
}
.profile-badge .initials{
  min-width:38px; height:38px; border-radius:10px;
  display:inline-grid; place-items:center;
  font-weight:800; letter-spacing:.6px; font-size:1rem;
  background: rgba(17,73,73,.12); color:#114949;
  text-transform: uppercase;
}
.profile-badge .role-icon{ font-size:1.05rem; opacity:.95; }

/* Role variants */
.profile-badge.badge-staff{ background: linear-gradient(180deg,#f7fbfb,#eef7f5); border-color: rgba(17,73,73,.22); }
.profile-badge.badge-staff .initials{ background: rgba(17,73,73,.16); color:#114949; }
.profile-badge.badge-staff .role-icon{ color:#d4a56b; }

.profile-badge.badge-beta{ background: linear-gradient(180deg,#fff7e6,#f4e4c2); border-color: #e5c98f; }
.profile-badge.badge-beta .initials{ background: rgba(212,165,107,.18); color:#114949; }
.profile-badge.badge-beta .role-icon{ color:#114949; }

.profile-badge.badge-user{ background: linear-gradient(180deg,#f4f6f7,#eef2f4); border-color:#cdd6da; }
.profile-badge.badge-user .initials{ background: rgba(0,0,0,.06); color:#304950; }
.profile-badge.badge-user .role-icon{ color:#304950; }

/* Size tuning on large screens */
@media (min-width: 992px){
  .profile-badge{ padding:.5rem .9rem; border-radius:16px; }
  .profile-badge .initials{ min-width:42px; height:42px; font-size:1.05rem; }
  .profile-badge .role-icon{ font-size:1.15rem; }
}

/* Accessibility focus */
.profile-badge:focus-visible{ outline:2px solid rgba(212,165,107,.85); outline-offset:3px; }
/* === Slack-style Initials Avatar (replaces profile-badge) === */
.slack-avatar{
  width: 88px; height: 88px; border-radius: 18px; /* Slack uses rounded squares */
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 6px 16px rgba(17,73,73,.10);
  border: 1px solid rgba(0,0,0,.06);
}
.slack-initials{
  font-weight: 800; font-size: 1.4rem; letter-spacing: .6px; color: #0f3d3d;
}
/* Role palettes */
.slack-avatar.slack-staff{ background: linear-gradient(135deg,#c9efea,#78b9b0); border-color: rgba(17,73,73,.25); }
.slack-avatar.slack-beta{  background: linear-gradient(135deg,#ffe9c2,#e7c27a); border-color: #d4a56b33; }
.slack-avatar.slack-user{  background: linear-gradient(135deg,#e8edf0,#c7d2d9); border-color: #b0bec54d; }

@media (min-width: 992px){
  .slack-avatar{ width: 100px; height: 100px; border-radius: 22px; }
  .slack-initials{ font-size: 1.6rem; }
}