* {margin: 0;padding: 0;box-sizing: border-box; /*font-family: "Poppins", sans-serif;*/font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;transition: all 0.4s ease;}
:root{--amucta-green: #fcdc09;--amucta-blue: rgba(5, 182, 252, 0.99);--amucta-dark: #111827;--amucta-teal-blue:#3E7A92}
a{text-decoration: none;color: inherit;}
h4{color:var(--amucta-blue);}
h1,h2,h3{color: var(--amucta-teal-blue)}
li{list-style-position: inside}
p.info {
    background-color: #e7f3fe;   /* Light blue */
    color: #084298;              /* Dark blue text */
    border-left: 5px solid #0d6efd;
    padding: 10px 15px;
    border-radius: 6px;
    margin-top: 1rem;
    font-family: Arial, sans-serif;
}

p.warning {
    margin-top: 1rem;
    background-color: #fff3cd;   /* Light yellow */
    color: #664d03;              /* Dark gold text */
    border-left: 5px solid #ffc107;
    padding: 10px 15px;
    border-radius: 6px;
    font-family: Arial, sans-serif;
}
th {background-color:var(--amucta-blue);color: white;text-align: center;padding: 0.5rem 1rem}
.alumni-grid {display: grid;grid-template-columns: repeat(auto-fill,minmax(250px,1fr));gap: 1rem;}
.alumni-card {background: #fff;border: 1px solid #ddd;border-radius: 8px;padding: 15px;box-shadow: 0 2px 4px rgba(0,0,0,0.1);}  .alumni-card h2 {font-size: 1.2em;margin-bottom: 8px;color: var(--amucta-blue);}
.alumni-actions {margin-top: 10px;display: flex;gap: 8px;}  /* Search Container */
#wrapperSearch {display: flex;justify-content: flex-end;margin-bottom: 1rem;gap: 0.5rem;}  /* Search Input */
#alumniSearch {padding: 0.5rem 1rem;width: 250px;border: 1px solid #ddd;border-radius: 6px;font-size: 0.95rem;transition: all 0.2s ease-in-out;}
#alumniSearch:focus {outline: none;border-color: var(--amucta-blue);box-shadow: 0 0 6px rgba(0,123,255,0.3);}  /* Placeholder style */
#alumniSearch::placeholder {color: #999;font-style: italic;}
/* Optional: Search icon inside input (if using background icon) */
#alumniSearch.search-icon { padding-left: 2.5rem;}
/* ----- Footer CTA Button ----- */
.footer-cta {margin-top: 1rem;text-align: center;}
.cta-btn {display: inline-block;padding: 0.75rem 1.75rem;background: linear-gradient(135deg, #059669, #10B981); /* green gradient */color: #fff;font-weight: 600;border-radius: 0.75rem;text-decoration: none;font-size: 1rem;transition: transform 0.2s ease, box-shadow 0.2s ease;box-shadow: 0 4px 12px rgba(5,150,105,0.3);}
.cta-btn:hover {transform: translateY(-3px);box-shadow: 0 6px 18px rgba(5,150,105,0.45);}
.cta-btn:active {transform: translateY(0);box-shadow: 0 3px 8px rgba(5,150,105,0.25);}

header {background-color: var(--amucta-teal-blue);color: white;box-shadow: 0 2px 10px rgba(0,0,0,0.15);position: fixed;width: 100%;top: 0;z-index: 1001}

header.scrolled .header-top {display: none; /* Hide top bar on scroll */}

header.scrolled .header-container {padding: 0 /* Reduced padding for compact one line */}

header.scrolled .logo {display: none; /* Hide logo on scroll */}
.header-top {background-color: rgba(255, 215, 0, 0.2); /* Light yellow tint for accent */padding: 0.5rem 1rem;text-align: end;font-size: 0.9rem;}
.header-top a{color: white;transition: all 0.3s ease;padding: 0 0.5rem;}
.header-top a:hover {background-color: var(--amucta-green);color: var(--amucta-teal-blue);}
.header-container {max-width: 100%;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 1.2rem;}
.logo {font-size: 1.8rem;font-weight: bold;color: var(--amucta-green);text-decoration: none;transition: all 0.3s ease;}
.logo img {height: 50px; /* Adjust logo image size */width: auto;}

.nav-menu {list-style: none;display: flex;justify-content: flex-end;align-items: center;flex-wrap: wrap;}
.nav-menu > li {position: relative;}
.nav-menu > li > a {color: white;text-decoration: none;padding: 0.8rem 1rem;border-radius: 5px;transition: all 0.3s ease;display: block;font-weight: 500;}
.nav-menu > li > a:hover {background-color: var(--amucta-green);color: var(--amucta-teal-blue);transform: translateY(-2px);}
.submenu {position: absolute;top: 100%;left: -50%;display: none;background-color: var(--amucta-teal-blue);min-width: 220px;box-shadow: 0 4px 10px rgba(0,0,0,0.2);transform: translateY(-10px);transition: all 0.5s ease;border-radius: 5px;z-index: 1001;list-style: none;}
.submenu li {border-bottom: 1px solid rgba(255,255,255,0.1);}
.submenu li a::before {content: "→ ";font-weight: bold;}

li:last-child .submenu{right: 0;left: auto;}
li:nth-last-child(2) .submenu{right: 0;left: auto;}
.submenu li:last-child {border-bottom: none;}
.submenu a {color: white;display: block;font-size: 0.95rem;padding: 0.8rem;text-decoration: none;}
.submenu a:hover {background-color: var(--amucta-green);color: var(--amucta-teal-blue);}

main {margin-top: 120px;min-height: 80vh;padding: 1rem;width: 100%;}
footer {background-color: var(--amucta-blue); /* Solid blue */color: white;margin-top: 3rem;}
.stats-section {background-color: transparent;padding: 3rem 0;text-align: center;}  .stats-container {max-width: 100%;margin: 0 auto;padding: 0 1rem;}  .stats-title {color: var(--amucta-green);font-size: 2.5rem;font-weight: bold;margin-bottom: 2.5rem;}  .stats-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 1rem;}  .stat-item {background: white;padding: 1rem;border-radius: 0.75rem;box-shadow: 0 4px 6px rgba(0,0,0,0.1);color: #333;}  .stat-number {font-size: 2rem;font-weight: bold;margin-bottom: 0.5rem;}  .stat-label {font-weight: 600;color: #666;}  .visitor-stat {grid-column: span 2;}  .visitor-stat .stat-number {color: #007BFF;}  .visitor-details {font-size: 0.875rem;color: #666;text-align: left;margin-top: 1rem;}  .visitor-details p {margin-bottom: 0.25rem;}  .visitor-details ul {list-style: disc;padding-left: 1rem;margin-top: 0.5rem;}  .visitor-details li {margin-bottom: 0.25rem;}
.footer-main {padding:8px; margin: 0 auto;background-color: #111827; /* Darker blue for main footer */}  .footer-grid {display: grid;grid-template-columns: 1fr;gap: 2.5rem;}
.newsletter-section h1 {font-size: 1.75rem;font-weight: 600;color: #9CA3AF;max-width: 32rem;margin-bottom: 2rem;}
.newsletter-form {display: flex;flex-direction: column;gap: 0.75rem;}  .newsletter-form input {padding: 0.5rem 1rem;border: 1px solid #4B5563;border-radius: 0.375rem;background-color: #111827;color: #D1D5DB;}  .newsletter-form input:focus {outline: none;border-color: #007BFF;}
.subscribe-btn {padding: 0.625rem 1.5rem;font-size: 0.875rem;font-weight: 500;color: white;background-color: var(--amucta-blue);border-radius: 0.5rem;border: none;cursor: pointer;transition: background-color 0.3s;}  .subscribe-btn:hover {background-color: #4B5563;}
.summary-section p {font-weight: 600;color: #9CA3AF;margin-bottom: 1.25rem;}  .summary-section .quick-links {font-weight: 600;color: #9CA3AF;margin-bottom: 0.75rem;}  .summary-section .links {display: flex;flex-wrap: wrap;gap: 0.375rem;}  .summary-section a {color: #9CA3AF;text-decoration: none;margin-left: 0.375rem;}  .summary-section a:hover {color: var(--amucta-green);}
.contact-section p {font-weight: 600;color: #9CA3AF;margin-bottom: 1.25rem;} .contact-details {display: flex;flex-direction: column;gap: 0.5rem;color: #9CA3AF;}  /* Social Section */
.social-section {display: flex;justify-content: center;gap: 0.75rem;margin-bottom: 1.5rem;}  .social-section a {display: inline-block;}  .social-section img {width: 2rem;height: 2rem;}  /* HR and Bottom */
.footer-hr {border-color: #4B5563;margin: 1.5rem 0;}  .footer-bottom {display: flex;flex-direction: column;align-items: center;gap: 1rem;text-align: center;}
.footer-logo {font-size: 1.5rem;font-weight: bold;color: #9CA3AF;text-decoration: none;} .footer-logo:hover {color: var(--amucta-green);}
.copyright {color: #9CA3AF;}

.logo-caption{font-size: 1.5rem;display: none;}
.mobile-menu-btn {display: none;background: none;border: none;color: white;font-size: 1.5rem;cursor: pointer;padding: 0.5rem;transition: transform 0.3s ease;}

.mobile-menu-btn.active {transform: rotate(90deg);}
.menu-close{display: none;}
@media (max-width: 768px) {
    header.scrolled .header-container {padding: 0.2rem 1rem;}  .header-top {display: none;}  .header-container {padding: 1rem;align-items: center;}  .logo {display: none;}
    .logo-caption{color: var(--amucta-green);display: flex;}  .mobile-menu-btn {display: block;}
    .menu-close{display: flex;background-color: #d92a2a;width: 30px;height: 30px;border-bottom-left-radius: 50%;justify-content: center;align-items: center;}
    .navigation-container{position: absolute;left: 0;top: 0;width: 0;z-index: 1001;height: 95vH;display: flex;flex-direction: column;overflow-y: auto;background-color: var(--amucta-dark);}
    .nav-menu {display: flex;flex-direction: column;align-items: start;}
    .nav-menu > li {position: relative;}
    .navigation-container.active{width: 75%;}
    .nav-menu li.active .submenu {display: block;}
    .nav-menu li a.active {background-color: var(--amucta-green);color: var(--amucta-blue);}
    .nav-menu li{display: flex;flex-direction: column;width:100%;justify-content: start;align-content: start;}  .nav-menu li a{width:100%;justify-content: start;align-content: start;}
    .submenu{position: unset;padding-left: 25px;}  main {margin-top: 100px;padding: 0.5rem;}  .stats-grid {grid-template-columns: repeat(2, 1fr);}  .visitor-stat {grid-column: span 2;}  .footer-grid {grid-template-columns: 1fr;gap: 2.5rem;}  .newsletter-form {flex-direction: column;}  .subscribe-btn {width: 100%;}
}
@media (min-width: 769px) { .nav-menu li:hover .submenu {display: block;transform: translateY(0);}  }

@media (min-width: 769px) and (max-width: 1024px) {  .stats-grid {grid-template-columns: repeat(4, 1fr);}  .visitor-stat {grid-column: span 1;}  .footer-grid {grid-template-columns: repeat(3, 1fr);gap: 2.5rem;}  .newsletter-form {flex-direction: row;}  .subscribe-btn {width: auto;margin-left: 0.5rem;}  }

@media (min-width: 1025px) { .stats-grid {grid-template-columns: repeat(4, 1fr);}  .visitor-stat {grid-column: span 1;}  .footer-grid {grid-template-columns: repeat(3, 1fr);gap: 2.5rem;}  }

/* Animations */
@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.main-content {animation: fadeIn 0.6s ease-out;}
@media print {  .no-print{display: none;}  }
div:has(table){width: 100%;overflow-x: auto}
form div:has(button[type='submit']) {display: flex;flex-direction: row;align-items: center;justify-content: end;}
.invisible {visibility: hidden;}  .visible {visibility: visible;}  .absolute {position: absolute;}  .fixed {position: fixed;}  .relative {position: relative;}  .static {position: static;}  .inset-0 {top: 0;right: 0;bottom: 0;left: 0;}  .z-50 {z-index: 50;}  .z-100 {z-index: 100;}  .z-auto {z-index: auto;}  .mx-2 {margin-left: 8px;margin-right: 8px;}  .mx-auto {margin-left: auto;margin-right: auto;}  .my-2 {margin-top: 8px;margin-bottom: 8px;}  .mt-1 {margin-top: 4px;}  .mt-2 {margin-top: 8px;}  .mt-3 {margin-top: 12px;}  .mt-4 {margin-top: 16px;}  .mt-6 {margin-top: 24px;}  .mt-8 {margin-top: 32px;}  .mt-12 {margin-top: 48px;}  .mr-2 {margin-right: 8px;}  .mb-2 {margin-bottom: 8px;}  .mb-4 {margin-bottom: 16px;}  .mb-6 {margin-bottom: 24px;}  .mb-8 {margin-bottom: 32px;}  .mb-12 {margin-bottom: 48px;}  .ml-2 {margin-left: 8px;}  .ml-3 {margin-left: 12px;}  .ml-5 {margin-left: 20px;}  .block {display: block;}  .hidden {display: none;}  .inline {display: inline;}  .inline-block {display: inline-block;}  .list-item {display: list-item;}  .h-6 {height: 24px;}  .h-14 {height: 56px;}  .h-16 {height: 64px;}  .h-24 {height: 96px;}  .h-40 {height: 160px}  .h-full {height: 100%;}  .w-0 {width: 0;}  .w-6 {width: 24px;}  .w-16 {width: 64px;}  .w-24 {width: 96px;}  .w-60 {width: 240px;}  .w-64 {width: 256px;}  .w-full {width: 100%;}  /* -- Max Width / Min Width -- */  .max-w-2xl {max-width: 42rem;} /* 672px */  .max-w-3xl {max-width: 48rem;} /* 768px */  .max-w-4xl {max-width: 56rem;} /* 896px */  .max-w-6xl {max-width: 72rem;} /* 1152px */  .max-w-full {max-width: 100%;}  .max-w-lg {max-width: 32rem;} /* 512px */  .max-w-md {max-width: 28rem;} /* 448px */  .max-w-none {max-width: none;}  .min-w-full {min-width: 100%;}  .-translate-full {transform: translate(-100%, -100%);}  .translate-full {transform: translate(100%, 100%);}  .-translate-x-full {transform: translateX(-100%);}  .translate-3d {transform: translate3d(0, 0, 0);}  .translate-none {transform: translate(0, 0);}  /* -- Scales -- */  .scale-3d {transform: scale3d(1, 1, 1);}  .scale-none {transform: scale(1);}  .cursor-not-allowed {cursor: not-allowed;}  .cursor-pointer {cursor: pointer;}  .resize {resize: both;}  .resize-none {resize: none;}  .resize-x {resize: horizontal;}  .resize-y {resize: vertical;}  /* --- Lists --- */  .list-inside {list-style-position: inside;}  .list-outside {list-style-position: outside;}  .list-decimal {list-style-type: decimal;}  .list-disc {list-style-type: disc;}  .list-none {list-style-type: none;}  .list-image-none {list-style-image: none;}  .truncate {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}  .overflow-hidden {overflow: hidden;}  .overflow-x-auto {overflow-x: auto;}  .overflow-y-auto {overflow-y: auto;}  .scroll-auto {scroll-behavior: auto;}  .scroll-smooth {scroll-behavior: smooth;}  /* --- Border Radius Settings --- */  .rounded {border-radius: 0.25rem; /* 4px */}  .rounded-full {border-radius: 9999px;}  .rounded-lg {border-radius: 0.5rem; /* 8px */}  .rounded-md {border-radius: 0.375rem; /* 6px */}  .rounded-sm {border-radius: 0.125rem; /* 2px */}  .rounded-s {border-start-start-radius: 0.25rem; /* 4px */border-end-start-radius: 0.25rem; /* 4px */}  .rounded-ss {border-start-start-radius: 0.25rem; /* 4px */}  .rounded-e {border-start-end-radius: 0.25rem; /* 4px */border-end-end-radius: 0.25rem; /* 4px */}  .rounded-se {border-start-end-radius: 0.25rem; /* 4px */}  .rounded-ee {border-end-end-radius: 0.25rem; /* 4px */}  .rounded-es {border-end-start-radius: 0.25rem; /* 4px */}  .rounded-t {border-top-left-radius: 0.25rem; /* 4px */border-top-right-radius: 0.25rem; /* 4px */}  .rounded-l {border-top-left-radius: 0.25rem; /* 4px */border-bottom-left-radius: 0.25rem; /* 4px */}  .rounded-tl {border-top-left-radius: 0.25rem; /* 4px */}  .rounded-r {border-top-right-radius: 0.25rem; /* 4px */border-bottom-right-radius: 0.25rem; /* 4px */}  .rounded-tr {border-top-right-radius: 0.25rem; /* 4px */}  .rounded-b {border-bottom-right-radius: 0.25rem; /* 4px */border-bottom-left-radius: 0.25rem; /* 4px */}  .rounded-br {border-bottom-right-radius: 0.25rem; /* 4px */}  .rounded-bl {border-bottom-left-radius: 0.25rem; /* 4px */}  /* --- Border Settings --- */  .border {border-style: solid;border-width: 1px;}  .border-x {border-inline-style: solid;border-inline-width: 1px;}  .border-y {border-block-style: solid;border-block-width: 1px;}  .border-s {border-inline-start-style: solid;border-inline-start-width: 1px;}  .border-e {border-inline-end-style: solid;border-inline-end-width: 1px;}  .border-t {border-top-style: solid;border-top-width: 1px;}  .border-r {border-right-style: solid;border-right-width: 1px;}  .border-b {border-bottom-style: solid;border-bottom-width: 1px;}  .border-l {border-left-style: solid;border-left-width: 1px;}  .border-dashed {border-style: dashed;}  .border-dotted {border-style: dotted;}  .border-double {border-style: double;}  .border-hidden {border-style: hidden;}  .border-none {border-style: none;}  .border-solid {border-style: solid;}  /* --- Border Colors --- */  .border-gray-200 {border-color: #e5e7eb;}  .border-gray-300 {border-color: #d1d5db;}  .border-gray-700 {border-color: #374151;}  /* --- Background Colors --- */  .bg-black {background-color: #000000;}  .bg-black-50 {background-color: rgba(0, 0, 0, 0.5);}  .bg-blue-500 {background-color: #3b82f6;}  .bg-blue-600 {background-color: #2563eb;}  .bg-gray-50 {background-color: #f9fafb;}  .bg-gray-100 {background-color: #f3f4f6;}  .bg-gray-300 {background-color: #e5e7eb;}  .bg-gray-400 {background-color: #d1d5db;}  .bg-gray-500 {background-color: #6b7280;}  .bg-gray-700 {background-color: #374151;}  .bg-gray-800 {background-color: #1f2937;}  .bg-gray-900 {background-color: #111827;}  .bg-green-500 {background-color: #10b981;}  .bg-green-600 {background-color: #16a34a;}  .bg-inherit {background-color: inherit;}  .bg-purple-600 {background-color: #8b5cf6;}  .bg-red-500 {background-color: #f87171;}  .bg-red-500-50 {background-color: rgba(248, 113, 113, 0.5);}  .bg-transparent {background-color: transparent;}  .bg-white {background-color: #ffffff;}  .bg-gradient-to-right {background-image: linear-gradient(to right, #ff7f7f, #f7f7f7);}  .bg-radial {background-image: radial-gradient(circle, #ff7f7f, #f7f7f7);}  .bg-none {background-image: none;}  .bg-auto {background-size: auto;}  .p-1 {padding: 4px;}  .p-2 {padding: 8px;}  .p-3 {padding: 12px;}  .p-4 {padding: 16px;}  .p-6 {padding: 24px;}  .p-8 {padding: 32px;}  .p-10 {padding: 40px;}  .px-2 {padding-left: 8px;padding-right: 8px;}  .px-3 {padding-left: 12px;padding-right: 12px;}  .px-4 {padding-left: 16px;padding-right: 16px;}  .px-5 {padding-left: 20px;padding-right: 20px;}  .px-6 {padding-left: 24px;padding-right: 24px;}  .py-1 {padding-top: 4px;padding-bottom: 4px;}  .py-2 {padding-top: 8px;padding-bottom: 8px;}  .py-3 {padding-top: 12px;padding-bottom: 12px;}  .py-4 {padding-top: 16px;padding-bottom: 16px;}  .py-8 {padding-top: 32px;padding-bottom: 32px;}  .py-16 {padding-top: 64px;padding-bottom: 64px;}  .py-20 {padding-top: 80px;padding-bottom: 80px;}  .pt-3 {padding-top: 12px;}  .pt-4 {padding-top: 16px;}  .pr-4 {padding-right: 16px;}  .pl-2 {padding-left: 8px;}  .text-center {text-align: center;}  .text-end {text-align: end;}  .text-justify {text-align: justify;}  .text-left {text-align: left;}  .text-right {text-align: right;}  .text-start {text-align: start;}  .text-2xl {font-size: 24px;line-height: 32px;}  .text-3xl {font-size: 30px;line-height: 36px;}  .text-4xl {font-size: 36px;line-height: 40px;}  .text-lg {font-size: 18px;line-height: 28px;}  .text-sm {font-size: 14px;line-height: 20px;}  .text-xl {font-size: 20px;line-height: 28px;}  .text-xs {font-size: 12px;line-height: 16px;}  .leading-none {line-height: 1;}  .font-bold {font-weight: 700;}  .font-medium {font-weight: 500;}  .font-semibold {font-weight: 600;}  /* Text wrapping */  .text-nowrap {white-space: nowrap;}  .text-wrap {white-space: normal;}  .break-normal {overflow-wrap: normal;word-break: normal;}  .break-words {overflow-wrap: break-word;}  .break-all {word-break: break-all;}  .break-keep {word-break: keep-all;}  .overflow-ellipsis {text-overflow: ellipsis;}  .text-clip {text-overflow: clip;}  .text-ellipsis {text-overflow: ellipsis;}  .hyphens-auto {-webkit-hyphens: auto;hyphens: auto;}  .hyphens-manual {-webkit-hyphens: manual;hyphens: manual;}  .hyphens-none {-webkit-hyphens: none;hyphens: none;}  .whitespace-break-spaces {white-space: break-spaces;}  .whitespace-normal {white-space: normal;}  .whitespace-nowrap {white-space: nowrap;}  .whitespace-pre {white-space: pre;}  .whitespace-pre-line {white-space: pre-line;}  .whitespace-pre-wrap {white-space: pre-wrap;}  .capitalize {text-transform: capitalize;}  .lowercase {text-transform: lowercase;}  .normal-case {text-transform: none;}  .uppercase {text-transform: uppercase;}  .italic {font-style: italic;}  .not-italic {font-style: normal;}  .font-stretch-condensed {font-stretch: condensed;}  .font-stretch-expanded {font-stretch: expanded;}  .font-stretch-extra-condensed {font-stretch: extra-condensed;}  .font-stretch-extra-expanded {font-stretch: extra-expanded;}  .font-stretch-normal {font-stretch: normal;}  .font-stretch-semi-condensed {font-stretch: semi-condensed;}  .font-stretch-semi-expanded {font-stretch: semi-expanded;}  .font-stretch-ultra-condensed {font-stretch: ultra-condensed;}  .font-stretch-ultra-expanded {font-stretch: ultra-expanded;}  .normal-nums {font-variant-numeric: normal;}  .line-through {text-decoration-line: line-through;}  .no-underline {text-decoration-line: none;}  .overline {text-decoration-line: overline;}  .underline {text-decoration-line: underline;}  .decoration-dashed {text-decoration-style: dashed;}  .decoration-dotted {text-decoration-style: dotted;}  .decoration-double {text-decoration-style: double;}  .decoration-solid {text-decoration-style: solid;}  .decoration-wavy {text-decoration-style: wavy;}  .color-red-50 {color: rgba(255, 0, 0, 0.5);}  .color-red-50-important {color: rgba(255, 0, 0, 0.5) !important;}  .text-blue-400 {color: #60a5fa;}  .text-blue-500 {color: #3b82f6;}  .text-blue-600 {color: #2563eb;}  .text-blue-700 {color: #1d4ed8;}  .text-gray-400 {color: #9ca3af;}  .text-gray-500 {color: #6b7280;}  .text-gray-600 {color: #4b5563;}  .text-gray-700 {color: #374151;}  .text-gray-800 {color: #1f2937;}  .text-gray-900 {color: #111827;}  .text-green-500 {color: #22c55e;}  .text-green-600 {color: #16a34a;}  .text-indigo-100 {color: #e0e7ff;}  .text-orange-500 {color: #f97316;}  .text-pink-500 {color: #ec4899;}  .text-purple-300 {color: #d8b4fe;}  .text-red-500 {color: #ef4444;}  .text-red-600 {color: #dc2626;}  .text-white {color: #ffffff;}  .text-yellow-500 {color: #eab308;}  .opacity-0 {opacity: 0;}  .underline-offset-auto {text-underline-offset: auto;}  .shadow {box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);}  .shadow-sm {box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);}  .shadow-md {}  .shadow-lg {box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);}  .shadow-xl {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);}  /* Ring Effects */  .transition {transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter, backdrop-filter;transition-timing-function: ease;transition-duration: 150ms;}  .transition-all {transition-property: all;transition-timing-function: ease;transition-duration: 150ms;}  .transition-colors {transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;transition-timing-function: ease;transition-duration: 150ms;}  .transition-opacity {transition-property: opacity;transition-timing-function: ease;transition-duration: 150ms;}  .transition-shadow {transition-property: box-shadow;transition-timing-function: ease;transition-duration: 150ms;}  .transition-transform {transition-property: transform;transition-timing-function: ease;transition-duration: 150ms;}  .transition-none {transition-property: none;}  .delay-50 {transition-delay: 50ms;}  .duration-100 {transition-duration: 100ms;}  .duration-300 {transition-duration: 300ms;}  .ease-in {transition-timing-function: ease-in;}  .ease-in-out {transition-timing-function: ease-in-out;}  .ease-linear {transition-timing-function: linear;}  .ease-out {transition-timing-function: ease-out;}  .outline-dashed {outline-style: dashed;}  .outline-dotted {outline-style: dotted;}  .outline-double {outline-style: double;}  .outline-none {outline-style: none;}  .outline-solid {outline-style: solid;}  .backface-hidden {backface-visibility: hidden;}  .backface-visible {backface-visibility: visible;}  .duration-initial {transition-duration: initial;}  .ease-initial {transition-timing-function: initial;}  .perspective-none {perspective: none;}  .card {background: #ffffff;border-radius: 12px;padding: 16px;box-shadow: 0 2px 8px rgba(0,0,0,0.1);transition: transform 0.2s ease-in-out;}  .card:hover {transform: translateY(-3px);box-shadow: 0 4px 12px rgba(0,0,0,0.15);}  .ring-inset {box-shadow: inset 0 0 0 1px currentColor;}  .md-hidden{display: none;}  .mobile-only {display: block;}  .desktop-only {display: none;}  .flex-wrap{flex-wrap:wrap !important}  .btn-primary { background:#4f46e5; color:white; }  /* Group wrapper */  .form-group {margin-bottom: 15px;}  /* Label styling */  .form-group label {display: block;margin-bottom: 6px;font-weight: 500;color: #333;}  .items-center{align-items: center;} .justify-start{justify-content: start;} .justify-center{justify-content: center;}.justify-end{justify-content: end;}
/* Input, select, textarea fields */
.form-control {display: block;width: 100%;padding: 8px 12px;font-size: 14px;line-height: 1.5;color: #495057;background-color: #fff;background-clip: padding-box;border: 1px solid #ced4da;border-radius: 6px;transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;}  /* On focus */  .form-control:focus {border-color: #80bdff;outline: 0;box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);}
/* Button */
.btn {display: inline-block;font-weight: 500;text-align: center;padding: 8px 16px;font-size: 14px;border-radius: 6px;cursor: pointer;border: 1px solid transparent;margin: 4px;}
.btn:hover {background-color: #004080;}  .btn-primary {background-color: #00BFFF; /* Sky Blue */}
.btn-primary:hover {background-color: #009acd;}
.flex{display: flex;}  .flex-col{flex-direction: column}  .flex-row{flex-direction: row;}
.btn-delete {background-color: #e74c3c;}
.btn-amucta {background-color: var(--amucta-green);color: var(--amucta-teal-blue)}
.btn-amucta:hover {background-color: var(--amucta-blue);color: white}
.grid { display: grid; grid-template-columns: repeat(1, minmax(0,1fr)); }
@media (min-width:768px){ .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); } }  .gap-0{gap:0 !important}.gap-1{gap:.25rem !important}.gap-2{gap:.5rem !important}.gap-3{gap:1rem !important}.gap-4{gap:1.5rem !important}.gap-5{gap:3rem !important}
.btn-danger {background-color: #e74c3c;}  .btn-delete:hover {background-color: #c0392b;}  .btn-danger:hover {background-color: #c0392b;}  .btn-complete, .btn-mark-read {background-color: #27ae60;}  .btn-complete:hover, .btn-mark-read:hover {background-color: #1e874b;}
textarea{box-sizing: border-box;padding: 0.5rem;margin-top: 0.5rem;margin-bottom: 0.5rem;border-radius: 0.25rem;width: 100%;font-size: 1.25rem;line-height: 1.75rem;resize: none;min-height: 200px;}
/* Table */
.solobea-table {width: 100%;border-collapse: collapse;margin-top: 15px;}  .solobea-table thead {background-color: var(--amucta-blue);color: #fff;}  .solobea-table th, .solobea-table td {padding: 10px;border: 1px solid #ddd;text-align: left;font-size: 0.9rem;vertical-align: top;}  .solobea-table th:hover{color: var(--amucta-blue);}  .solobea-table tr:nth-child(even) {background-color: #f9f9f9;}  .solobea-table tr:hover {background-color: #f1f1f1;}
.overlay {display: none; /* Hidden by default */position: fixed;justify-content: center; /* Center horizontally */align-items: center; /* Center vertically */top: 0; /* Below the header */left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);z-index: 10000;}
.popup-overlay {position: fixed;inset: 0;background: rgba(0,0,0,0.6);display: flex;justify-content: center;align-items: center;z-index: 9998;}  /* Popup container */  .popup-editor {background: #fff;width: 80%;max-width: 900px;height: 80%;display: flex;flex-direction: column;border-radius: 12px;overflow: hidden;box-shadow: 0 5px 20px rgba(0,0,0,0.3);z-index: 9999;}  .popup-header {background: var(--amucta-blue);color: white;padding: 12px;font-weight: bold;display: flex;justify-content: space-between;align-items: center;}  .popup-header button {background: transparent;border: none;color: white;font-size: 18px;cursor: pointer;}  .popup-body {flex: 1;display: flex;flex-direction: column;overflow-y: auto;padding: 12px;}  .popup-body textarea {flex: 1;width: 100%;border: 1px solid #ddd;border-radius: 6px;padding: 10px;resize: none;font-family: monospace;}  .popup-footer {padding: 10px;text-align: right;border-top: 1px solid #ddd;}  .popup-footer button {background: #16a34a;color: white;border: none;padding: 8px 14px;border-radius: 6px;cursor: pointer;}  .popup-footer button:hover {background: #15803d;}  .tension-question{}

@media (min-width: 768px) { .mobile-only {display: none;}  .desktop-only {display: flex;}  .md-hidden{display: flex;}  }
/* Responsive */
@media (max-width: 768px) {  .solobea-table th, .solobea-table td {font-size: 0.8rem;padding: 8px;}  .btn {font-size: 0.8rem;padding: 6px 10px;}  }
.chat-message.bot.typing::after {content: " ";display: inline-block;animation: dots 1.5s steps(3, end) infinite;}

@keyframes dots { 0%   { content: " "; } 33%  { content: "."; } 66%  { content: ".."; } 100% { content: "..."; } }