/* Connected TTH Portal CSS */

/*
 * ICON MAP — Lucide (connectedportal) → Font Awesome 6 Free (ConnectedTTH)
 * When adding new UI that mirrors the portal, use the FA6 class listed here.
 * -------------------------------------------------------------------------
 * activity          → fas fa-heart-pulse
 * alert-circle      → fas fa-circle-exclamation
 * arrow-left        → fas fa-arrow-left
 * arrow-right       → fas fa-arrow-right
 * bell              → fas fa-bell
 * brain             → fas fa-brain
 * briefcase         → fas fa-briefcase
 * building-2        → fas fa-building
 * calendar          → fas fa-calendar
 * calendar-check    → fas fa-calendar-check
 * chart-column      → fas fa-chart-bar
 * check             → fas fa-check
 * check-circle      → fas fa-circle-check
 * chevron-down      → fas fa-chevron-down
 * chevron-left      → fas fa-chevron-left
 * chevron-right     → fas fa-chevron-right
 * circle            → fas fa-circle
 * circle-check      → fas fa-circle-check
 * circle-x          → fas fa-circle-xmark
 * clipboard-list    → fas fa-clipboard-list
 * clock             → fas fa-clock
 * credit-card       → fas fa-credit-card
 * droplet           → fas fa-droplet
 * file              → fas fa-file
 * file-text         → fas fa-file-lines
 * flask-conical     → fas fa-flask
 * heart             → fas fa-heart
 * heart-pulse       → fas fa-heart-pulse
 * info              → fas fa-circle-info
 * layout-dashboard  → fas fa-table-cells-large
 * link              → fas fa-link
 * log-out           → fas fa-right-from-bracket
 * mail              → fas fa-envelope
 * map-pin           → fas fa-location-dot
 * maximize-2        → fas fa-expand
 * menu              → fas fa-bars
 * message-square    → fas fa-comment
 * messages-square   → fas fa-comments
 * minimize-2        → fas fa-compress
 * monitor           → fas fa-desktop
 * phone             → fas fa-phone
 * pill              → fas fa-pills
 * plus              → fas fa-plus
 * search            → fas fa-magnifying-glass
 * send              → fas fa-paper-plane
 * settings          → fas fa-gear
 * shield            → fas fa-shield-halved
 * siren             → fas fa-triangle-exclamation
 * sparkles          → fas fa-wand-magic-sparkles
 * star              → fas fa-star
 * stethoscope       → fas fa-stethoscope
 * syringe           → fas fa-syringe
 * trash-2           → fas fa-trash
 * user              → fas fa-user
 * user-circle       → fas fa-circle-user
 * video             → fas fa-video
 * x                 → fas fa-xmark
 * -------------------------------------------------------------------------
 */

/* Override ThemeBuilder border color to match connectedportal (styles.css sets --color-border: #e5e7eb) */
:root {
    --color-border: #e5e7eb;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-family: var(--font-family);
    font-size: 16px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    margin: 0;
    padding: 0;
    font-family: inherit;
    color: var(--color-text);
    background-color: var(--color-background);
}

h1, h2, h3, h4, h5, h6 {
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    margin: 0;
}

h1 { font-size: 2rem; }
h2 { font-size: var(--font-size-2xl); }
h3 { font-size: var(--font-size-xl); }
h4 { font-size: var(--font-size-lg); }
h5 { font-size: var(--font-size-base); }
h6 { font-size: var(--font-size-sm); }

button {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

.fullheight {
    height: 100vh;
}

/* Login page styles */
.formlabel {
    margin: 10px 0;
}

.formlabel1 {
    margin: 5px 0;
}


/* Responsive design */
@media (max-width: 768px) {
    .center_logbox {
        width: 95% !important;
        padding: 10px;
    }


    .main-content {
        padding: 10px !important;
    }
}

/* Utility classes */
.text-center {
    text-align: center;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

.p-20 {
    padding: 20px;
}

/* Error styles */
.error-message {
    color: #dc3545;
    background-color: #f8d7da;
    border: 1px solid var(--color-border);
    padding: 10px;
    border-radius: var(--border-radius);
    margin: 10px 0;
}

/* Success styles */
.success-message {
    color: #155724;
    background-color: #d4edda;
    border: 1px solid var(--color-border);
    padding: 10px;
    border-radius: var(--border-radius);
    margin: 10px 0;
}