@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
    --font-arabic: 'Tajawal', ui-sans-serif, system-ui, sans-serif;
}



/**
    The lines above are intact.
    The lines below were added by maryUI installer.
*/

@plugin "daisyui" {
  themes: light --default, dark --prefersdark, cupcake, cyberpunk, dracula, forest, garden, halloween, light, lofi, night, synthwave, winter;
}






/* maryUI */
@source "../../vendor/robsontenorio/mary/src/View/Components/**/*.php";

/* Theme toggle */
@custom-variant dark (&:where(.dark, .dark *));

/* Arabic: use Tajawal font (override font-sans on body and all descendants) */
html[lang="ar"],
html[lang="ar"] body {
    font-family: var(--font-arabic) !important;
}
html[lang="ar"] [class*="font-"] {
    font-family: var(--font-arabic) !important;
}

/* Content area gradient only when DaisyUI light theme is active */
html[data-theme="light"] .content-light-theme-gradient {
    background-image: linear-gradient(#ffffff, #ececec47);
}

/**
* Paginator - Traditional style
* Because Laravel defaults does not match well the design of daisyUI.
*/

.mary-table-pagination span[aria-current="page"] > span {
    @apply bg-primary text-base-100
}

.mary-table-pagination button {
    @apply cursor-pointer
}

/* Card action dropdowns: ensure menu appears above adjacent cards */
.dropdown .dropdown-content,
ul.dropdown-content {
    z-index: 50;
}

/* When a card’s dropdown is open, raise the card so the menu is above other cards */
.group:has(details.dropdown[open]) {
    z-index: 20;
}

/* Table row with open actions dropdown: raise row so menu appears above other rows */
.table tbody tr:has(details.dropdown[open]) {
    position: relative;
    z-index: 30;
}

/* Data table: toolbar above table so bulk actions dropdown is not hidden by thead */
.data-table-card .data-table-toolbar {
    position: relative;
    z-index: 10;
}
.data-table-card .data-table-wrapper {
    position: relative;
    z-index: 1;
    @apply rounded-b-xl overflow-visible;
}
/* Data table: row action dropdown menu above toolbar and other content */
.data-table-card .data-table-wrapper .table tbody .dropdown-content {
    z-index: 9999 !important;
}
.data-table-card .data-table-wrapper .table {
    @apply border-0;
}
.data-table-card .data-table-wrapper .table thead {
    @apply bg-base-200/60 text-base-content border-b border-base-300/60;
}
.data-table-card .data-table-wrapper .table thead th {
    @apply py-3 px-4 text-xs font-semibold uppercase tracking-wider text-base-content/80 whitespace-nowrap;
}
.data-table-card .data-table-wrapper .table tbody td {
    @apply py-3 px-4 align-middle border-b border-base-300/30;
}
.data-table-card .data-table-wrapper .table tbody tr:last-child td {
    @apply border-b-0;
}
.data-table-card .data-table-wrapper .table tbody tr:hover {
    @apply bg-base-200/40;
}
.data-table-card .data-table-wrapper .table.table-zebra tbody tr:nth-child(even) {
    @apply bg-base-200/20;
}
.data-table-card .data-table-wrapper .table.table-zebra tbody tr:nth-child(even):hover {
    @apply bg-base-200/50;
}

/* Form field labels: normal weight */
.fieldset-legend {
    font-weight: 400;
}

/* Smaller font for form field hint text */
.fieldset-label,
.label-text-alt {
    font-size: 0.75rem;
}

/* Sidebar: scrollbar thumb visible only on hover; track always reserves space so layout never shifts */
.sidebar-scroll-area {
    scrollbar-gutter: stable;
    overflow-y: scroll;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}
.sidebar-scroll-area:hover {
    scrollbar-color: rgb(0 0 0 / 0.3) transparent;
}
/* WebKit: thumb only on hover; overflow-y: scroll above reserves space */
.sidebar-scroll-area::-webkit-scrollbar {
    width: 6px;
}
.sidebar-scroll-area::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 0;
}
.sidebar-scroll-area::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
}
.sidebar-scroll-area:hover::-webkit-scrollbar-thumb {
    background: rgb(0 0 0 / 0.25);
}
.sidebar-scroll-area:hover::-webkit-scrollbar-thumb:hover {
    background: rgb(0 0 0 / 0.4);
}

/* Roles: permissions column – ensure content is never hidden by collapse or theme */
.roles-permissions-column,
.roles-permissions-column .roles-permissions-module,
.roles-permissions-column .roles-permissions-module * {
    visibility: visible !important;
    opacity: 1 !important;
}
/* Hide default details/summary marker so only our chevron shows */
.roles-permissions-module summary::-webkit-details-marker {
    display: none;
}
.roles-permissions-module summary::marker {
    display: none;
}

@layer components {
    /* Targets the maryUI/daisyUI input wrapper to remove the focus ring globally */
    .input.input-bordered:focus,
    .input.input-bordered:focus-within {
        outline: 2px solid transparent !important;
        outline-offset: 2px !important;
        --tw-ring-offset-width: 0px !important;
        --tw-ring-color: transparent !important;
        box-shadow: none !important;
        /* Keeps your custom border color consistent */
        border-color: theme('colors.base-300 / 60%') !important;
    }
}

/* Cards that contain tables or grid view: consistent box-shadow */
.card:has(table),
.card:has(.grid) {
    box-shadow: 0 3px 15px -2px rgba(0, 0, 0, 0.12) !important;
}

/* Staff index: no shadow on main card or grid item cards */
.staff-index-card {
    box-shadow: none !important;
}

/* Finance table actions: keep dropdown menus above the table */
.finance-actions-cell {
    position: relative;
    z-index: 20;
}

.finance-actions-cell .dropdown-content {
    z-index: 9999 !important;
}
