/*
 * Namarc POS — visual refinements on top of the Velzon theme.
 * Loaded after app.min.css / custom.min.css so these rules win without
 * touching the vendor Bootstrap/Velzon build.
 */

:root {
    --pharm-radius: 0.6rem;
    --pharm-shadow: 0 2px 10px rgba(30, 41, 59, 0.06);
    --pharm-shadow-hover: 0 6px 18px rgba(30, 41, 59, 0.10);
}

body {
    letter-spacing: 0.1px;
}

/* ---------- Cards ---------- */
.card {
    border: 1px solid rgba(60, 76, 128, 0.08);
    border-radius: var(--pharm-radius);
    box-shadow: var(--pharm-shadow);
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.card.card-animate:hover {
    box-shadow: var(--pharm-shadow-hover);
    transform: translateY(-2px);
}

.card-header {
    border-bottom: 1px solid rgba(60, 76, 128, 0.08);
    background-color: rgba(64, 81, 137, 0.02);
}

.card-header .card-title {
    font-weight: 600;
    letter-spacing: 0.2px;
}

/* Report hub cards on the Reports landing page */
.report-hub-card {
    cursor: pointer;
}

.report-hub-card:hover {
    border-color: rgba(64, 81, 137, 0.25);
}

/* ---------- Tables ---------- */
.table {
    font-size: 0.875rem;
}

.table thead th {
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.4px;
    color: #6b7280;
    background-color: #f8f9fc;
    border-bottom-width: 1px;
    white-space: nowrap;
}

.table-bordered td,
.table-bordered th {
    border-color: rgba(60, 76, 128, 0.08);
}

.table > tbody > tr:hover > * {
    background-color: rgba(64, 81, 137, 0.035);
}

/* ---------- Badges ---------- */
.badge {
    font-weight: 500;
    letter-spacing: 0.2px;
}

/* ---------- Buttons ---------- */
.btn {
    border-radius: 0.45rem;
    font-weight: 500;
}

.btn-soft-primary:hover,
.btn-soft-success:hover,
.btn-soft-danger:hover,
.btn-soft-info:hover {
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.12);
}

/* ---------- Sidebar branding ---------- */
.navbar-brand-box {
    display: flex;
    align-items: center;
    justify-content: center;
}

.app-menu .menu-title span {
    font-size: 0.7rem;
    letter-spacing: 0.6px;
    font-weight: 700;
    opacity: 0.65;
}

/* ---------- Footer ---------- */
.footer {
    border-top: 1px solid rgba(60, 76, 128, 0.08);
    font-size: 0.8125rem;
    color: #8a92a3;
}

/* ==========================================================================
 * Button / action preloaders
 * Paired with public/build/js/pharmacy-preloader.js which toggles the
 * `.btn-loading` class on any control while its request is in flight.
 * ========================================================================== */
.btn-loading {
    position: relative;
    pointer-events: none;
    color: transparent !important;
}

.btn-loading .btn-loading-label {
    visibility: hidden;
}

.btn-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1rem;
    height: 1rem;
    margin: -0.5rem 0 0 -0.5rem;
    border-radius: 50%;
    border: 0.15rem solid rgba(255, 255, 255, 0.55);
    border-top-color: #fff;
    animation: pharm-btn-spin 0.6s linear infinite;
}

/* Light/outline/soft buttons need a dark spinner, not a white one */
.btn-light.btn-loading::after,
.btn-soft-primary.btn-loading::after,
.btn-soft-success.btn-loading::after,
.btn-soft-danger.btn-loading::after,
.btn-soft-info.btn-loading::after,
.btn-soft-warning.btn-loading::after,
.btn-outline-primary.btn-loading::after,
.btn-outline-secondary.btn-loading::after,
a.btn-loading::after,
.dropdown-item.btn-loading::after {
    border-color: rgba(3, 64, 117, 0.25);
    border-top-color: #034075;
}

@keyframes pharm-btn-spin {
    to { transform: rotate(360deg); }
}

/* Small inline spinner used for anchor/dropdown "export" style links,
   where the whole label shouldn't be hidden. */
.export-btn.btn-loading {
    color: inherit !important;
    pointer-events: none;
    opacity: 0.65;
}

.export-btn.btn-loading::after {
    position: static;
    display: inline-block;
    margin: 0 0 0 6px;
    top: auto;
    left: auto;
    width: 0.8rem;
    height: 0.8rem;
    border-width: 0.12rem;
    vertical-align: -1px;
}

/* ==========================================================================
 * Login / auth split-panel layout
 * Paired with resources/views/auth/login.blade.php - a branded panel on the
 * left (with the existing particles.js background wired in) and a plain
 * sign-in form on the right, replacing the old single centered card.
 * ========================================================================== */
.auth-split-wrapper {
    min-height: 100vh;
    width: 100%;
    display: flex;
}

.auth-brand-panel {
    position: relative;
    flex: 0 0 55%;
    max-width: 55%;
    background: linear-gradient(135deg, #034075 0%, #021f38 100%);
    overflow: hidden;
}

.auth-brand-panel > *:not(.auth-particles) {
    position: relative;
    z-index: 2;
}

.auth-brand-heading {
    font-size: 2rem;
    line-height: 1.3;
    max-width: 480px;
}

.auth-particles {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.auth-form-panel {
    flex: 1;
    min-width: 0;
    background-color: #fff;
    min-height: 100vh;
}

.auth-form-inner {
    max-width: 380px;
    margin: 0 auto;
}

/* ---------- Print styles for receipts / printable pages ---------- */
@media print {
    #page-topbar,
    .app-menu,
    .footer,
    .vertical-overlay,
    .customizer-setting,
    #back-to-top {
        display: none !important;
    }

    .main-content {
        margin-left: 0 !important;
    }

    .card {
        box-shadow: none !important;
        border: none !important;
    }
}

/* ---------- Toastify color classes ----------
   Toastify() is called throughout the app with className: "success" /
   "error" / "errors" (both spellings are used in the codebase) but the
   library never shipped any color rules for those classes, so every
   toast rendered with its default blue gradient regardless of outcome.
   These map each className to the same semantic colors used elsewhere
   in the Velzon theme (success/danger/warning/info). */
.toastify.success {
    background: var(--vz-success, #0ab39c) !important;
}

.toastify.error,
.toastify.errors,
.toastify.danger {
    background: var(--vz-danger, #f06548) !important;
}

.toastify.warning {
    background: var(--vz-warning, #f7b84b) !important;
    color: #1a1a1a !important;
}

.toastify.warning .toast-close {
    color: #1a1a1a !important;
}

.toastify.info {
    background: var(--vz-info, #299cdb) !important;
}

/* "Complete your shop setup" / "Choose a subscription plan" sidebar
   lock rules now live in layouts/Build/master.blade.php's inline
   <style> block, targeting the new .dash-nav markup (see
   Build/Partials/sidebar.blade.php) instead of the old Velzon
   .navbar-nav > .nav-item structure these used to target. */

/* ==========================================================================
 * Namarc brand colors
 * Pulled directly from the brand assets in public/images/brand/ (see
 * logo-icon.svg) - navy #034075 is the primary brand color, gold #b8862f
 * is the accent. Bootstrap/Velzon theme everything off custom properties
 * (--vz-primary and friends) - overriding just those here re-themes every
 * var(--vz-primary)-based element (buttons, links, badges, focus rings,
 * sidebar highlights in some skins) without touching the vendor CSS
 * build in bootstrap.min.css/app.min.css. Declared for both the light
 * and dark [data-bs-theme] scopes so the rebrand holds regardless of
 * which the user has switched to.
 * ========================================================================== */
:root,
[data-bs-theme="light"] {
    --vz-primary: #034075;
    --vz-primary-rgb: 3, 64, 117;
    --vz-primary-text-emphasis: #022c50;
    --vz-primary-bg-subtle: #dbe6ee;
    --vz-primary-border-subtle: #0a5691;
    --vz-link-color: #034075;
    --vz-link-color-rgb: 3, 64, 117;
    --vz-link-hover-color: #022c50;
    --vz-link-hover-color-rgb: 2, 44, 80;
}

[data-bs-theme="dark"] {
    /* Lightened so navy still reads against a near-black background -
       the same relationship the vendor theme itself uses (its dark-mode
       --vz-primary/--vz-link-color are lighter than the light-mode ones). */
    --vz-primary: #4d84b8;
    --vz-primary-rgb: 77, 132, 184;
    --vz-primary-text-emphasis: #8bb6dc;
    --vz-primary-bg-subtle: rgba(3, 64, 117, 0.25);
    --vz-primary-border-subtle: #2a557f;
    --vz-link-color: #8bb6dc;
    --vz-link-color-rgb: 139, 182, 220;
    --vz-link-hover-color: #aecbe6;
    --vz-link-hover-color-rgb: 174, 203, 230;
}

/* The old Velzon .navbar-menu .navbar-nav sidebar gold-accent rules
   that used to live here are gone — the sidebar is now the .dash-*
   shell in layouts/Build/master.blade.php, which styles its own
   active/hover states directly. */