/*! Gallaxyku Modern Design System v2.0 | Internal Printing Management */
/* ====================================================================
   DESIGN TOKENS & VARIABLES
   ==================================================================== */
:root {
  /* Color palette - gray scale */
  --gray-50:#f9fafb; --gray-100:#f3f4f6; --gray-200:#e5e7eb; --gray-300:#d1d5db; --gray-400:#9ca3af; --gray-500:#6b7280; --gray-600:#4b5563; --gray-700:#374151; --gray-800:#1f2937; --gray-900:#111827;
  /* Primary brand color */
  --blue-50:#eff6ff; --blue-100:#dbeafe; --blue-200:#bfdbfe; --blue-500:#3b82f6; --blue-600:#2563eb; --blue-700:#1d4ed8; --blue-800:#1e40af;
  /* Success, warning, danger */
  --green-50:#f0fdf4; --green-100:#dcfce7; --green-500:#22c55e; --green-600:#16a34a; --green-700:#15803d;
  --yellow-50:#fefce8; --yellow-100:#fef9c3; --yellow-500:#eab308; --yellow-600:#ca8a04; --yellow-700:#a16207; --yellow-800:#854d0e;
  --red-50:#fef2f2; --red-100:#fee2e2; --red-500:#ef4444; --red-600:#dc2626; --red-700:#b91c1c; --red-800:#991b1b;
  --purple-600:#9333ea; --purple-700:#7e22ce;
  /* Semantic tokens */
  --color-bg:#f5f7fa; --color-surface:#ffffff; --color-border:#d9e1ec; --color-border-soft:#eaedf2;
  --color-text:#1b2330; --color-text-muted:#5a6676; --color-text-soft:#6b7280;
  --color-primary:var(--blue-600); --color-primary-hover:var(--blue-700); --color-primary-soft:var(--blue-100);
  --color-success:var(--green-600); --color-success-soft:var(--green-100);
  --color-danger:var(--red-600); --color-danger-soft:var(--red-100);
  --color-warning:var(--yellow-600); --color-warning-soft:var(--yellow-100);
  /* Spacing scale (rem) */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem;
  /* Border radius */
  --radius-xs:3px; --radius-sm:6px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-pill:999px; --radius-full:50%;
  /* Shadows */
  --shadow-xs:0 1px 2px rgba(0,0,0,.04); --shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.05); --shadow-md:0 4px 6px -1px rgba(0,0,0,.08),0 2px 4px -2px rgba(0,0,0,.05); --shadow-lg:0 10px 15px -3px rgba(0,0,0,.08),0 4px 6px -4px rgba(0,0,0,.05); --shadow-xl:0 20px 25px -5px rgba(0,0,0,.08),0 8px 10px -6px rgba(0,0,0,.05);
  /* Typography */
  --font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  --font-mono:ui-monospace,'Cascadia Code','Source Code Pro','Menlo','Monaco','Consolas','Liberation Mono','Courier New',monospace;
  --font-size-xs:.75rem; --font-size-sm:.875rem; --font-size-base:1rem; --font-size-lg:1.125rem; --font-size-xl:1.25rem; --font-size-2xl:1.5rem; --font-size-3xl:1.875rem;
  --line-height-tight:1.25; --line-height-normal:1.5; --line-height-relaxed:1.75;
  /* Transitions */
  --transition-fast:.12s cubic-bezier(.4,0,.2,1); --transition-base:.18s cubic-bezier(.4,0,.2,1); --transition-slow:.3s cubic-bezier(.4,0,.2,1);
  /* Z-index scale */
  --z-dropdown:1000; --z-sticky:1020; --z-fixed:1030; --z-modal-backdrop:1040; --z-modal:1050; --z-popover:1060; --z-tooltip:1070;
}
/* ====================================================================
   BASE STYLES & RESETS
   ==================================================================== */
*,*::before,*::after{box-sizing:border-box;}html{-webkit-text-size-adjust:100%; -webkit-tap-highlight-color:transparent;}
html,body{margin:0; padding:0; scroll-behavior:smooth;}
body{font-family:var(--font-sans); background:var(--color-bg); color:var(--color-text); font-size:var(--font-size-base); line-height:var(--line-height-normal); display:flex; flex-direction:column; min-height:100vh; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
main{flex:1 0 auto; padding:var(--space-4);}
h1,h2,h3,h4,h5,h6{margin:0; font-weight:600; line-height:var(--line-height-tight); letter-spacing:-.01em;}
h1{font-size:var(--font-size-2xl);} h2{font-size:var(--font-size-xl);} h3{font-size:var(--font-size-lg);}
p{margin:0 0 var(--space-4);}
img,svg{display:block; max-width:100%; height:auto;}
a{text-decoration:none; color:var(--color-primary); transition:color var(--transition-fast);} a:hover{color:var(--color-primary-hover);} a:focus-visible{outline:2px solid var(--color-primary); outline-offset:2px; border-radius:var(--radius-xs);}
ul,ol{margin:0; padding:0; list-style:none;}
button{font-family:inherit; cursor:pointer;}
input,button,select,textarea{font:inherit;}
/* ====================================================================
   LAYOUT UTILITIES
   ==================================================================== */
.container{width:100%; margin-left:auto; margin-right:auto; padding-left:var(--space-4); padding-right:var(--space-4);} @media (min-width:640px){.container{max-width:640px;}} @media (min-width:768px){.container{max-width:768px;}} @media (min-width:1024px){.container{max-width:1024px;}} @media (min-width:1280px){.container{max-width:1220px;}}
.flex{display:flex;} .flex-col{flex-direction:column;} .flex-wrap{flex-wrap:wrap;} .items-start{align-items:flex-start;} .items-center{align-items:center;} .items-end{align-items:flex-end;} .justify-start{justify-content:flex-start;} .justify-center{justify-content:center;} .justify-end{justify-content:flex-end;} .justify-between{justify-content:space-between;} .gap-1{gap:var(--space-1);} .gap-2{gap:var(--space-2);} .gap-3{gap:var(--space-3);} .gap-4{gap:var(--space-4);} .gap-6{gap:var(--space-6);}
.grid{display:grid; gap:var(--space-4);} .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));} .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));} .grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));} @media (min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));} .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));} .md\:flex{display:flex;}}
/* Spacing utilities */
.p-0{padding:0;} .p-2{padding:var(--space-2);} .p-3{padding:var(--space-3);} .p-4{padding:var(--space-4);} .p-6{padding:var(--space-6);} .px-2{padding-left:var(--space-2); padding-right:var(--space-2);} .px-3{padding-left:var(--space-3); padding-right:var(--space-3);} .px-4{padding-left:var(--space-4); padding-right:var(--space-4);} .py-1{padding-top:var(--space-1); padding-bottom:var(--space-1);} .py-2{padding-top:var(--space-2); padding-bottom:var(--space-2);} .py-3{padding-top:var(--space-3); padding-bottom:var(--space-3);}
.m-0{margin:0;} .mt-2{margin-top:var(--space-2);} .mt-3{margin-top:var(--space-3);} .mt-4{margin-top:var(--space-4);} .mt-6{margin-top:var(--space-6);} .mt-8{margin-top:var(--space-8);} .mb-1{margin-bottom:var(--space-1);} .mb-2{margin-bottom:var(--space-2);} .mb-3{margin-bottom:var(--space-3);} .mb-4{margin-bottom:var(--space-4);} .mb-6{margin-bottom:var(--space-6);} .ml-auto{margin-left:auto;} .mx-auto{margin-left:auto; margin-right:auto;}
.space-y-2>*+*{margin-top:var(--space-2);} .space-y-3>*+*{margin-top:var(--space-3);} .space-y-4>*+*{margin-top:var(--space-4);}
/* Sizing */
.w-full{width:100%;} .h-8{height:2rem;} .h-10{height:2.5rem;} .min-h-screen{min-height:100vh;} .max-w-xs{max-width:20rem;} .max-w-sm{max-width:24rem;} .max-w-md{max-width:28rem;} .max-w-lg{max-width:32rem;} .max-w-xl{max-width:36rem;} .max-w-2xl{max-width:42rem;} .max-w-3xl{max-width:48rem;} .max-w-full{max-width:100%;}
.overflow-hidden{overflow:hidden;} .overflow-x-auto{overflow-x:auto;} .overflow-y-auto{overflow-y:auto;} .max-h-72{max-height:18rem;}
/* ====================================================================
   TYPOGRAPHY UTILITIES
   ==================================================================== */
.font-normal{font-weight:400;} .font-medium{font-weight:500;} .font-semibold{font-weight:600;} .font-bold{font-weight:700;} .font-mono{font-family:var(--font-mono);}
.text-xs{font-size:var(--font-size-xs);} .text-sm{font-size:var(--font-size-sm);} .text-base{font-size:var(--font-size-base);} .text-lg{font-size:var(--font-size-lg);} .text-xl{font-size:var(--font-size-xl);} .text-2xl{font-size:var(--font-size-2xl);} .text-3xl{font-size:var(--font-size-3xl);}
.text-left{text-align:left;} .text-center{text-align:center;} .text-right{text-align:right;}
.uppercase{text-transform:uppercase;} .lowercase{text-transform:lowercase;} .capitalize{text-transform:capitalize;}
.underline{text-decoration:underline;} .no-underline{text-decoration:none;}
.truncate{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* Color utilities */
.text-white{color:#fff;} .text-gray-400{color:var(--gray-400);} .text-gray-500{color:var(--gray-500);} .text-gray-600{color:var(--gray-600);} .text-gray-700{color:var(--gray-700);} .text-blue-600{color:var(--blue-600);} .text-blue-700{color:var(--blue-700);} .text-green-600{color:var(--green-600);} .text-red-600{color:var(--red-600);} .text-red-800{color:var(--red-800);} .text-yellow-700{color:var(--yellow-700);} .text-yellow-800{color:var(--yellow-800);}
.bg-white{background:var(--color-surface);} .bg-gray-50{background:var(--gray-50);} .bg-gray-100{background:var(--gray-100);} .bg-blue-100{background:var(--blue-100);} .bg-blue-600{background:var(--blue-600);} .bg-blue-700{background:var(--blue-700);} .bg-green-600{background:var(--green-600);} .bg-yellow-100{background:var(--yellow-100);} .bg-yellow-500{background:var(--yellow-500);} .bg-red-100{background:var(--red-100);} .bg-purple-600{background:var(--purple-600);}
/* ====================================================================
   BORDER & SHADOW UTILITIES
   ==================================================================== */
.rounded{border-radius:var(--radius-sm);} .rounded-md{border-radius:var(--radius-md);} .rounded-lg{border-radius:var(--radius-lg);} .rounded-full{border-radius:var(--radius-full);} .rounded-pill{border-radius:var(--radius-pill);}
.border{border:1px solid var(--color-border);} .border-t{border-top:1px solid var(--color-border-soft);} .border-b{border-bottom:1px solid var(--color-border-soft);}
.shadow-xs{box-shadow:var(--shadow-xs);} .shadow-sm{box-shadow:var(--shadow-sm);} .shadow{box-shadow:var(--shadow-md);} .shadow-md{box-shadow:var(--shadow-md);} .shadow-lg{box-shadow:var(--shadow-lg);}
/* ====================================================================
   INTERACTIVE UTILITIES
   ==================================================================== */
.cursor-pointer{cursor:pointer;} .pointer-events-none{pointer-events:none;}
.transition{transition:all var(--transition-base);} .transition-colors{transition:color var(--transition-fast), background-color var(--transition-fast), border-color var(--transition-fast);}
.opacity-0{opacity:0;} .opacity-50{opacity:.5;} .opacity-75{opacity:.75;} .opacity-100{opacity:1;}
.invisible{visibility:hidden;} .visible{visibility:visible;}
.hidden{display:none;} @media (min-width:768px){.md\:block{display:block;} .md\:hidden{display:none;}}
/* ====================================================================
   COMPONENT: NAVIGATION
   ==================================================================== */
.app-nav{background:var(--color-surface); border-bottom:1px solid var(--color-border-soft); position:sticky; top:0; z-index:var(--z-sticky); backdrop-filter:blur(8px) saturate(180%); box-shadow:var(--shadow-xs);}
.nav-brand{display:flex; align-items:center; gap:var(--space-3); font-weight:600; font-size:15px; color:var(--color-text);}
.nav-items{display:flex; align-items:center; gap:var(--space-5);} .nav-items a{font-size:13px; font-weight:500; color:var(--color-text-muted); transition:color var(--transition-fast); position:relative;} .nav-items a:hover{color:var(--color-primary);} .nav-items a.active{color:var(--color-primary);} .nav-items a.active::after{content:''; position:absolute; bottom:-12px; left:0; right:0; height:2px; background:var(--color-primary);}
.nav-danger{color:var(--red-600);} .nav-danger:hover{color:var(--red-700);}
.nav-toggle{display:block; background:none; border:none; padding:var(--space-2); color:var(--color-text); font-size:24px; line-height:1;} @media (min-width:768px){.nav-toggle{display:none;}}
@media (max-width:767px){.nav-items{position:absolute; top:100%; left:0; right:0; background:var(--color-surface); flex-direction:column; align-items:stretch; gap:0; padding:var(--space-2); border-bottom:1px solid var(--color-border-soft); box-shadow:var(--shadow-md); display:none;} .nav-items.active{display:flex;} .nav-items a{padding:var(--space-3); border-radius:var(--radius-sm);} .nav-items a:hover{background:var(--gray-50);}}
/* ====================================================================
   COMPONENT: BUTTONS
   ==================================================================== */
.btn,button[class*="btn-"]{display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); font-size:var(--font-size-sm); font-weight:500; line-height:1.2; padding:.625rem 1rem; border-radius:var(--radius-sm); border:1px solid transparent; cursor:pointer; transition:all var(--transition-fast); position:relative; text-decoration:none;} .btn:disabled{opacity:.5; cursor:not-allowed; pointer-events:none;} .btn:focus-visible{outline:3px solid var(--color-primary-soft); outline-offset:2px;}
.btn-primary,.btn-primary{background:var(--color-primary); color:#fff; border-color:var(--color-primary);} .btn-primary:hover{background:var(--color-primary-hover); border-color:var(--color-primary-hover);} .btn-primary:active{transform:translateY(1px);}
.btn-success{background:var(--color-success); color:#fff; border-color:var(--color-success);} .btn-success:hover{background:var(--green-700);}
.btn-danger{background:var(--color-danger); color:#fff; border-color:var(--color-danger);} .btn-danger:hover{background:var(--red-700);}
.btn-warning{background:var(--color-warning); color:#fff; border-color:var(--color-warning);} .btn-warning:hover{background:var(--yellow-700);}
.btn-outline{background:#fff; color:var(--color-text); border-color:var(--color-border);} .btn-outline:hover{border-color:var(--color-primary); color:var(--color-primary); background:var(--blue-50);}
.btn-ghost{background:transparent; color:var(--color-text-muted); border-color:transparent;} .btn-ghost:hover{background:var(--gray-100); color:var(--color-text);}
.btn-sm{padding:.425rem .75rem; font-size:var(--font-size-xs);} .btn-lg{padding:.875rem 1.5rem; font-size:var(--font-size-base);}
.btn-pill{border-radius:var(--radius-pill);}
a.btn-primary{color:#fff;} a.btn-success{color:#fff;} a.btn-danger{color:#fff;}
/* ====================================================================
   COMPONENT: FORMS
   ==================================================================== */
label{display:block; font-size:var(--font-size-sm); font-weight:500; color:var(--color-text-soft); margin-bottom:var(--space-2);} label.required::after{content:' *'; color:var(--color-danger);}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=tel],select,textarea{width:100%; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-sm); padding:.625rem .75rem; font-size:var(--font-size-sm); line-height:var(--line-height-normal); color:var(--color-text); transition:border-color var(--transition-fast), box-shadow var(--transition-fast);} input:focus,select:focus,textarea:focus{border-color:var(--color-primary); outline:0; box-shadow:0 0 0 3px var(--color-primary-soft);} input:disabled,select:disabled,textarea:disabled{background:var(--gray-50); cursor:not-allowed; opacity:.6;}
input.input-error{border-color:var(--color-danger);} input.input-error:focus{box-shadow:0 0 0 3px var(--red-100);}
textarea{resize:vertical; min-height:5rem;}
select{cursor:pointer; padding-right:2.5rem; background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); background-position:right .5rem center; background-repeat:no-repeat; background-size:1.5em 1.5em; appearance:none;}
.form-group{margin-bottom:var(--space-4);}
.form-error{font-size:var(--font-size-xs); color:var(--color-danger); margin-top:var(--space-1);}
.form-hint{font-size:var(--font-size-xs); color:var(--color-text-muted); margin-top:var(--space-1);}
/* ====================================================================
   COMPONENT: CARDS
   ==================================================================== */
.card{background:var(--color-surface); border:1px solid var(--color-border-soft); border-radius:var(--radius-lg); padding:var(--space-5); box-shadow:var(--shadow-sm); transition:box-shadow var(--transition-fast), transform var(--transition-fast);} .card:hover{box-shadow:var(--shadow-md);}
.card-header{font-size:var(--font-size-sm); font-weight:600; color:var(--color-text-muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:var(--space-3); padding-bottom:var(--space-3); border-bottom:1px solid var(--color-border-soft);}
.card-body{padding:var(--space-4) 0;}
.card-footer{padding-top:var(--space-4); border-top:1px solid var(--color-border-soft); display:flex; gap:var(--space-3); justify-content:flex-end;}
.card-stat{text-align:center;} .card-stat-value{font-size:var(--font-size-3xl); font-weight:700; color:var(--color-text); line-height:1;} .card-stat-label{font-size:var(--font-size-sm); color:var(--color-text-muted); margin-top:var(--space-2);}
/* ====================================================================
   COMPONENT: TABLES
   ==================================================================== */
.table-container{border:1px solid var(--color-border-soft); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-surface); box-shadow:var(--shadow-sm);}
table{width:100%; border-collapse:collapse; background:var(--color-surface); font-size:var(--font-size-sm);}
thead{background:var(--gray-50);} thead th{text-align:left; font-weight:600; color:var(--color-text); padding:.75rem 1rem; border-bottom:2px solid var(--color-border-soft); white-space:nowrap;}
tbody tr{border-bottom:1px solid var(--color-border-soft); transition:background-color var(--transition-fast);} tbody tr:last-child{border-bottom:none;} tbody tr:hover{background:var(--gray-50);}
tbody td{padding:.75rem 1rem; color:var(--color-text);}
.table-actions{display:flex; gap:var(--space-2); align-items:center;}
.table-wrap{border:1px solid var(--color-border-soft); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-surface);}
/* ====================================================================
   COMPONENT: BADGES & PILLS
   ==================================================================== */
.badge{display:inline-flex; align-items:center; gap:var(--space-1); padding:.2rem .6rem; border-radius:var(--radius-pill); font-size:var(--font-size-xs); font-weight:600; line-height:1.2;}
.badge-primary{background:var(--blue-100); color:var(--blue-700);} .badge-success{background:var(--green-100); color:var(--green-700);} .badge-danger{background:var(--red-100); color:var(--red-700);} .badge-warning{background:var(--yellow-100); color:var(--yellow-800);} .badge-gray{background:var(--gray-200); color:var(--gray-700);}
/* ====================================================================
   COMPONENT: ALERTS & MESSAGES
   ==================================================================== */
.alert{padding:var(--space-4); border-radius:var(--radius-md); border:1px solid; margin-bottom:var(--space-4); font-size:var(--font-size-sm);}
.alert-info{background:var(--blue-50); border-color:var(--blue-200); color:var(--blue-800);} .alert-success{background:var(--green-50); border-color:var(--green-100); color:var(--green-700);} .alert-warning{background:var(--yellow-50); border-color:var(--yellow-100); color:var(--yellow-700);} .alert-danger{background:var(--red-50); border-color:var(--red-100); color:var(--red-700);}
/* ====================================================================
   COMPONENT: EMPTY STATES
   ==================================================================== */
.empty-state{padding:var(--space-12) var(--space-4); text-align:center; color:var(--color-text-muted);} .empty-state-icon{font-size:var(--font-size-3xl); margin-bottom:var(--space-3); opacity:.4;} .empty-state-title{font-size:var(--font-size-lg); font-weight:600; color:var(--color-text); margin-bottom:var(--space-2);} .empty-state-desc{font-size:var(--font-size-sm); color:var(--color-text-muted); max-width:28rem; margin:0 auto var(--space-4);}
/* ====================================================================
   COMPONENT: PAGINATION
   ==================================================================== */
.pagination{display:flex; gap:var(--space-2); align-items:center; justify-content:center; padding:var(--space-4);} .pagination a,.pagination span{display:inline-flex; align-items:center; justify-content:center; min-width:2.25rem; height:2.25rem; padding:0 var(--space-3); border-radius:var(--radius-sm); font-size:var(--font-size-sm); font-weight:500; transition:all var(--transition-fast);} .pagination a{background:var(--gray-100); color:var(--color-text);} .pagination a:hover{background:var(--gray-200);} .pagination .active{background:var(--color-primary); color:#fff;}
/* ====================================================================
   COMPONENT: FOOTER
   ==================================================================== */
footer{margin-top:auto; padding:var(--space-6) var(--space-4); text-align:center; background:transparent; color:var(--color-text-muted); font-size:var(--font-size-xs);}
/* ====================================================================
   ANIMATIONS
   ==================================================================== */
.fade-in{animation:fade-in .4s ease;} @keyframes fade-in{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);}}
.slide-in{animation:slide-in .3s ease;} @keyframes slide-in{from{opacity:0; transform:translateX(-12px);} to{opacity:1; transform:translateX(0);}}
.scale-in{animation:scale-in .2s ease;} @keyframes scale-in{from{opacity:0; transform:scale(.95);} to{opacity:1; transform:scale(1);}}
/* ====================================================================
   UTILITY: SCROLLBAR STYLING
   ==================================================================== */
::-webkit-scrollbar{width:10px; height:10px;} ::-webkit-scrollbar-track{background:var(--gray-100);} ::-webkit-scrollbar-thumb{background:var(--gray-300); border-radius:var(--radius-sm);} ::-webkit-scrollbar-thumb:hover{background:var(--gray-400);}
/* ====================================================================
   ACCESSIBILITY
   ==================================================================== */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border-width:0;}
*:focus-visible{outline:2px solid var(--color-primary); outline-offset:2px; border-radius:var(--radius-xs);}