/*
/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

@import url("/assets/slimselect-de9c5d96.css");
@import url("/assets/permissions_overview-c3202646.css");
@import url("/assets/newsletter_flipbook-889fe1fd.css");
@import url("/assets/schedule_skeleton-0580ff07.css");

/* Compact SlimSelect Styling - Match Tailwind search field appearance */
/* Equivalent to: bg-background p-1 block w-full shadow-sm sm:text-sm border-border rounded-md */

.ss-main {
    background-color: var(--background) !important;
    border: 1px solid var(--border) !important;
    border-radius: 0.375rem !important; /* rounded-md */
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important; /* shadow-sm */
    min-height: auto !important;
    padding: 0 !important;
}

.ss-main .ss-single-selected,
.ss-main .ss-multi-selected {
    padding: 0.25rem 0.5rem !important; /* p-1 with slightly more horizontal padding for arrow */
    font-size: 0.875rem !important; /* sm:text-sm */
    line-height: 1.25rem !important;
    min-height: auto !important;
    display: flex !important;
    align-items: center !important;
}

.ss-main .ss-single-selected .ss-placeholder,
.ss-main .ss-multi-selected .ss-placeholder {
    font-size: 0.875rem !important;
    padding: 0 !important;
}

/* Multi-select values */
.ss-main .ss-values {
    gap: 0.25rem !important;
}

.ss-main .ss-value {
    padding: 0.125rem 0.375rem !important;
    font-size: 0.875rem !important;
    border-radius: 0.25rem !important; /* rounded */
    background-color: var(--secondary) !important;
    color: var(--foreground) !important; /* Changed to foreground for better visibility */
}

.ss-main .ss-value .ss-value-text {
    font-size: 0.875rem !important;
    color: var(--foreground) !important; /* Changed to foreground for better visibility */
}

.ss-main .ss-value .ss-value-delete {
    height: 0.875rem !important;
    width: 0.875rem !important;
    margin-left: 0.25rem !important;
    border-left: solid 1px var(--muted-foreground) !important;
}

.ss-main .ss-value .ss-value-delete svg path {
    stroke: var(--foreground) !important;
}

/* Arrow */
.ss-main .ss-arrow {
    height: 0.75rem !important;
    width: 0.75rem !important;
    margin-right: 0.25rem !important;
}

/* Deselect button */
.ss-main .ss-deselect {
    height: 0.875rem !important;
    width: 0.875rem !important;
    margin-right: 0.25rem !important;
}

/* Dropdown content */
.ss-content {
    border: 1px solid var(--border) !important;
    border-radius: 0.375rem !important; /* rounded-md */
    background-color: var(--background) !important;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important; /* shadow */
    padding: 0.25rem !important;
}

/* Search input in dropdown */
.ss-content .ss-search input {
    padding: 0.25rem 0.5rem !important; /* p-1 */
    font-size: 0.875rem !important; /* sm:text-sm */
    background-color: var(--background) !important;
    border: 1px solid var(--border) !important;
    border-radius: 0.25rem !important; /* rounded */
    color: var(--foreground) !important;
}

.ss-content .ss-search input::placeholder {
    color: var(--muted-foreground) !important;
}

.ss-content .ss-search input:focus {
    outline: 2px solid var(--ring) !important;
    outline-offset: 2px !important;
}

/* Options list */
.ss-content .ss-list {
    padding: 0 !important;
}

/* Individual options */
.ss-content .ss-option {
    padding: 0.25rem 0.5rem !important; /* p-1 with horizontal padding */
    font-size: 0.875rem !important; /* sm:text-sm */
    line-height: 1.25rem !important;
    border-radius: 0.25rem !important; /* rounded */
    color: var(--foreground) !important;
}

.ss-content .ss-option:hover {
    background-color: var(--secondary) !important;
    color: var(--secondary-foreground) !important;
}

.ss-content .ss-option.ss-highlighted {
    background-color: var(--primary) !important;
    color: var(--primary-foreground) !important;
}

.ss-content .ss-option.ss-selected {
    background-color: var(--secondary) !important;
    color: var(--foreground) !important;
    font-weight: 500 !important;
}

.ss-content .ss-option.ss-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Optgroups */
.ss-content .ss-optgroup-label {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.75rem !important; /* text-xs */
    font-weight: 600 !important;
    color: var(--muted-foreground) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.ss-content .ss-optgroup .ss-option {
    padding-left: 1rem !important; /* Indent options under optgroup */
}

/* Focus state for main select */
.ss-main:focus-within {
    outline: 2px solid var(--ring) !important;
    outline-offset: 2px !important;
    border-color: var(--ring) !important;
}

/* Disabled state */
.ss-main.ss-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    background-color: var(--muted) !important;
}

.sticky-header th {
    position: sticky;
    top: 0;
    background-color: var(--background);
    z-index: 10;
}

.sticky-first-column tr td:first-child {
    position: sticky;
    left: 0;
    background-color: var(--background);
    z-index: 10;
}

.scrollable-container {
    max-height: 50vh;
    overflow: auto;
}

.signature-image {
    width: 113px;
    height: 31px;
}


.hierarchy-list {
    list-style-type: none;
    padding-left: 0;
}

.hierarchy-list li {
    border-left: 1px solid var(--border);
    margin-left: 20px; /* Increase indent for each level */
    padding-left: 20px;
    position: relative;
}

.hierarchy-list li:before {
    content: '';
    position: absolute;
    top: 0;
    left: -10px;
    bottom: -10px;
    width: 10px;
    border-left: 1px solid var(--border);
}

.hierarchy-list li:last-child:before {
    height: 10px;
}

.hierarchy-wrapper {
    width: 70%;
    max-height: 600px; /* Adjust as needed */
    overflow: auto; /* Enables scrolling */
    border: 1px solid var(--border);
}


.inline-action {
    display: none;
}

.inline-edit .inline-action {
    display: initial;
}

th {
    position: relative;
}

th, td {
    min-width: 30px; /* or any other value you see fit */
}

.total-row {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    background-color: var(--muted);
    border-top: 1px solid var(--border);
}

.total-label {
    margin-right: 1rem;
    font-weight: bold;
}

.total-value {
    font-weight: bold;
}

/* Flash styles have been moved to flash_messages.css */

/* Print Styles for Timecard */
@media print {
    body.printing-timecard {
        /* Print page settings */
        margin: 0;
        padding: 0;
    }

    /* Hide everything except what we specifically want to show */
    body.printing-timecard * {
        visibility: hidden;
    }

    /* Show the printable area and all its children */
    body.printing-timecard [data-timecard-print-target="printableArea"],
    body.printing-timecard [data-timecard-print-target="printableArea"] * {
        visibility: visible;
    }

    /* Position printable area at top left */
    body.printing-timecard [data-timecard-print-target="printableArea"] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }

    /* Hide rows marked for exclusion */
    body.printing-timecard .print-hidden,
    body.printing-timecard .print-hidden * {
        visibility: hidden;
        display: none;
    }

    /* Table styling */
    body.printing-timecard table {
        width: 100%;
        border-collapse: collapse;
    }

    body.printing-timecard th,
    body.printing-timecard td {
        padding: 8px;
        border: 1px solid #000;
        text-align: left;
    }

    body.printing-timecard th {
        background-color: #f3f4f6;
        font-weight: bold;
    }

    /* Print-only header */
    body.printing-timecard .print\\:block {
        display: block;
    }

    /* Page settings */
    @page {
        margin: 0.5in;
        size: landscape;
    }

    /* Ensure colors print */
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

