*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(135deg,#f6f7fb,#eef2f7);color:#101828}.layout{display:flex;min-height:100vh}.sidebar{width:250px;background:#0b1220;color:#fff;padding:22px;position:fixed;inset:0 auto 0 0;z-index:30;transition:.25s;box-shadow:20px 0 50px rgba(15,23,42,.10)}.brand{font-size:25px;font-weight:900;margin-bottom:16px;letter-spacing:-.5px}.brand span{color:#f7c948}.user-pill{background:#172033;border:1px solid #263248;border-radius:18px;padding:12px;margin-bottom:18px}.user-pill b{display:block}.user-pill small{display:block;color:#98a2b3;margin-top:4px}.sidebar nav{display:flex;flex-direction:column;gap:6px}.sidebar a{display:block;color:#d0d5dd;text-decoration:none;padding:12px 14px;border-radius:15px;font-weight:800}.sidebar a:hover,.sidebar a.active{background:#f7c948;color:#101828}.main{margin-left:250px;width:calc(100% - 250px);padding:24px}.mobile-menu{display:none;border:0;background:#0b1220;color:#fff;border-radius:16px;padding:12px 15px;font-size:22px;box-shadow:0 10px 26px rgba(16,24,40,.18);z-index:40}.grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:16px}.card{background:rgba(255,255,255,.92);border:1px solid #edf0f6;border-radius:24px;padding:20px;box-shadow:0 12px 32px rgba(16,24,40,.07)}.stat-card{display:block;text-decoration:none;color:#172033;position:relative;overflow:hidden;transition:.2s}.stat-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(16,24,40,.12)}.stat-card h3{margin:0;color:#667085;font-size:14px}.stat-card strong{font-size:32px;display:block;margin-top:8px}.stat-card span{display:inline-block;margin-top:10px;color:#344054;font-size:13px;font-weight:900}.page-title{display:flex;justify-content:space-between;align-items:center;margin:4px 0 18px}.page-title h1{margin:0;font-size:30px;letter-spacing:-.7px}.btn{background:#101828;color:#fff;border:0;border-radius:15px;padding:12px 17px;text-decoration:none;display:inline-block;cursor:pointer;font-weight:900}.btn.light{background:#eef2ff;color:#101828}.btn.danger{background:#d92d20}.btn.gold{background:#f7c948;color:#101828}.form{background:#fff;padding:22px;border-radius:26px;box-shadow:0 12px 32px rgba(16,24,40,.07);display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.form label{font-weight:800;font-size:13px}.form input,.form select,.form textarea{width:100%;padding:13px;border:1px solid #d9dee8;border-radius:15px;margin-top:7px;background:#fff;font-size:15px}.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:#f7c948;box-shadow:0 0 0 4px rgba(247,201,72,.18)}.form .full{grid-column:1/-1}.table-wrap{width:100%;overflow:auto;border-radius:22px;box-shadow:0 12px 32px rgba(16,24,40,.07);background:white}.table{width:100%;border-collapse:collapse;background:#fff;min-width:850px}.table th,.table td{padding:15px 18px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:middle}.table th{background:#f8fafc;color:#59677d;font-size:14px}.badge{padding:8px 12px;border-radius:999px;background:#eef2ff;font-size:12px;font-weight:900}.alert{padding:14px 16px;border-radius:16px;margin-bottom:14px;background:#ecfdf3;color:#027a48}.alert.error{background:#fef3f2;color:#b42318}.search{margin-bottom:14px;display:flex;gap:10px}.search input{padding:12px;border:1px solid #d0d5dd;border-radius:14px;min-width:260px}.img-thumb{width:68px;height:68px;object-fit:cover;border-radius:16px;background:#eee}.pos-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:18px;align-items:start}.pos-products{background:#fff;border-radius:26px;padding:16px;box-shadow:0 12px 32px rgba(16,24,40,.07)}.pos-toolbar{display:flex;gap:10px;margin-bottom:12px}.two-inputs{grid-template-columns:1fr 280px}.pos-toolbar input{width:100%;padding:14px;border:1px solid #d9dee8;border-radius:17px;font-size:15px}.pos-toolbar input:focus{outline:none;border-color:#f7c948;box-shadow:0 0 0 4px rgba(247,201,72,.16)}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:14px}.product-card{border:1px solid #ece4bd;background:linear-gradient(180deg,#fff8df,#fff4c2);border-radius:22px;padding:11px;cursor:pointer;transition:.18s;text-align:left;color:#101828}.product-card:hover,.product-card.selected{border-color:#f0b429;box-shadow:0 12px 28px rgba(16,24,40,.14);transform:translateY(-2px)}.product-card img{width:100%;height:140px;object-fit:cover;border-radius:17px;background:#f2f4f7}.product-card h3{font-size:14px;margin:10px 0 8px}.size-line{font-size:13px;color:#334155;margin:6px 0 8px}.product-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}.price-pill,.stock-pill{background:#fff;border:1px solid #e4e7ec;border-radius:999px;padding:8px 10px;font-size:12px;font-weight:900}.plus{width:36px;height:36px;border-radius:50%;border:0;background:#2563eb;color:white;font-size:22px;display:inline-flex;align-items:center;justify-content:center}.product-card.disabled{opacity:.55;filter:grayscale(.35);cursor:not-allowed}.product-card.disabled .plus{display:none}.stock-pill.out{background:#fee2e2;color:#991b1b}.pos-cart{position:sticky;top:18px;background:#0b1220;color:#fff;border-radius:26px;padding:18px;box-shadow:0 12px 36px rgba(16,24,40,.18)}.pos-cart h2{margin:0 0 12px;font-size:21px}.selected-box{background:#172033;border:1px solid #344054;border-radius:18px;padding:14px;margin-bottom:12px;min-height:82px}.selected-box b{display:block}.pos-cart label{display:block;font-weight:900;font-size:13px;margin:10px 0}.pos-cart input,.pos-cart select,.pos-cart textarea{width:100%;padding:12px;border:1px solid #344054;border-radius:14px;margin-top:6px;background:#fff;color:#101828}.total-line{display:flex;justify-content:space-between;border-top:1px solid #344054;margin-top:14px;padding-top:14px;font-weight:900;font-size:18px}.empty-msg{color:#98a2b3}.overlay{display:none}.live-result{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}.live-result button,.live-result span{border:0;border-radius:14px;background:#eef2ff;color:#101828;padding:10px 12px;font-weight:900;cursor:pointer}.live-result.dark button,.live-result.dark span{background:#1d2939;color:#fff;border:1px solid #344054}.size-picker{border:1px solid #edf0f6;background:#f8fafc;border-radius:22px;padding:16px}.size-picker h3{margin:0 0 4px}.size-picker p{margin:0 0 12px;color:#667085}.size-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.size-option{background:#fff;border:1px solid #d9dee8;border-radius:16px;padding:10px;display:flex;align-items:center;justify-content:space-between;gap:8px}.size-option.active{border-color:#f0b429;background:#fff8df}.size-option input{width:70px;margin:0;padding:9px;text-align:center}.custom-size-row{display:grid;grid-template-columns:1fr 120px;gap:10px;margin-top:12px}.custom-size-row input{margin:0}.table td:nth-child(5){font-weight:800;color:#0f172a}
@media(max-width:1180px){.grid{grid-template-columns:repeat(2,1fr)}.pos-layout{grid-template-columns:1fr}.pos-cart{position:static}.product-grid{grid-template-columns:repeat(2,minmax(160px,1fr))}.two-inputs{display:grid;grid-template-columns:1fr 1fr}.size-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:800px){body{background:#f7f8fb}.mobile-menu{display:block;position:fixed;left:12px;top:12px}.layout{display:block}.sidebar{transform:translateX(-105%);width:min(86vw,310px)}.sidebar.open{transform:translateX(0)}.overlay.show{display:block;position:fixed;inset:0;background:rgba(16,24,40,.45);z-index:20}.main{margin-left:0;width:100%;padding:74px 12px 16px}.grid,.form{grid-template-columns:1fr}.page-title{display:block}.page-title h1{font-size:25px}.btn{margin-top:8px;width:100%;text-align:center}.search{display:block}.search input{min-width:0;width:100%;margin-bottom:8px}.pos-toolbar,.two-inputs{display:grid;grid-template-columns:1fr}.product-grid{grid-template-columns:1fr}.product-card img{height:178px}.pos-products,.pos-cart,.card,.form{border-radius:20px;padding:14px}.table-wrap{border-radius:18px}.table{min-width:780px}.table th,.table td{padding:12px;font-size:13px}.size-grid{grid-template-columns:repeat(2,1fr)}.custom-size-row{grid-template-columns:1fr}.img-thumb{width:58px;height:58px}}
@media(max-width:430px){.main{padding-left:8px;padding-right:8px}.product-card img{height:150px}.size-grid{grid-template-columns:1fr}.product-meta{display:grid;grid-template-columns:1fr auto}.price-pill,.stock-pill{display:inline-block}.grid{gap:10px}.card{padding:15px}.page-title h1{font-size:23px}}


/* ===== MOBILE RESPONSIVE FIX 2026-05-31 ===== */
.mobile-topbar{display:none}
.mobile-brand{font-size:20px;font-weight:950;letter-spacing:-.5px;color:#fff}.mobile-brand span{color:#f7c948}

@media(max-width:900px){
  html,body{width:100%;max-width:100%;overflow-x:hidden;background:#f5f7fb}
  .layout{display:block;min-height:100vh;width:100%}
  .mobile-topbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:60;width:100%;height:62px;padding:10px 12px;background:#0b1220;box-shadow:0 8px 24px rgba(16,24,40,.18)}
  .mobile-menu{display:inline-flex!important;position:static!important;left:auto!important;top:auto!important;align-items:center;justify-content:center;width:42px;height:42px;border:0!important;background:#f7c948!important;color:#0b1220!important;border-radius:14px!important;padding:0!important;font-size:25px!important;line-height:1!important;box-shadow:none!important;z-index:70!important}
  .sidebar{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(82vw,300px)!important;max-width:300px!important;height:100vh!important;overflow-y:auto!important;transform:translateX(-110%)!important;transition:transform .22s ease!important;z-index:80!important;padding:22px 18px!important;border-radius:0 24px 24px 0!important;box-shadow:20px 0 60px rgba(0,0,0,.28)!important;background:#0b1220!important}
  .sidebar.open{transform:translateX(0)!important}
  .overlay{display:none!important}
  .overlay.show{display:block!important;position:fixed!important;inset:0!important;background:rgba(15,23,42,.55)!important;z-index:70!important;backdrop-filter:blur(2px)}
  .main{margin-left:0!important;width:100%!important;max-width:100%!important;padding:18px 12px 22px!important}
  .brand{font-size:24px;margin-bottom:18px}.user-pill{border-radius:18px;margin-bottom:14px}.sidebar a{padding:13px 14px;border-radius:14px;font-size:16px}
  .page-title{display:flex!important;gap:12px;align-items:center!important;justify-content:space-between!important;margin:0 0 14px!important;flex-wrap:wrap}.page-title h1{font-size:28px!important;line-height:1.1}.page-title .btn{width:auto!important;margin-top:0!important}
  .grid{grid-template-columns:1fr!important;gap:12px!important}.card,.form,.pos-products,.pos-cart{border-radius:22px!important;padding:14px!important}.form{grid-template-columns:1fr!important}.form .full{grid-column:auto!important}
  .pos-layout{display:block!important}.pos-cart{position:static!important;margin-top:14px!important}.pos-toolbar,.two-inputs{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.product-grid{grid-template-columns:1fr!important;gap:12px!important}.product-card img{height:165px!important}.size-grid{grid-template-columns:1fr 1fr!important}.custom-size-row{grid-template-columns:1fr!important}
  .search{display:grid!important;grid-template-columns:1fr!important}.search input{width:100%!important;min-width:0!important}.table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}.table{min-width:760px!important}.img-thumb{width:60px!important;height:60px!important;border-radius:14px!important}
}
@media(max-width:430px){.main{padding:14px 8px 18px!important}.mobile-topbar{height:58px}.page-title h1{font-size:24px!important}.product-card img{height:140px!important}.size-grid{grid-template-columns:1fr!important}.btn{width:100%!important}.table{min-width:700px!important}.table th,.table td{font-size:12px!important;padding:10px!important}}

/* ===== PRACTICAL MOBILE + CLEAR SIZES PATCH ===== */
.stat-card{isolation:isolate;min-height:135px;border:0!important;background:linear-gradient(135deg,#ffffff,#f8fafc)!important}.stat-card:before{content:"";position:absolute;inset:auto -25% -35% auto;width:120px;height:120px;border-radius:999px;background:rgba(247,201,72,.22);z-index:-1;transition:.25s}.stat-card:hover:before{transform:scale(1.18)}.stat-card:nth-child(1){background:linear-gradient(135deg,#eff6ff,#ffffff)!important}.stat-card:nth-child(1):before{background:rgba(37,99,235,.18)}.stat-card:nth-child(2){background:linear-gradient(135deg,#ecfdf3,#ffffff)!important}.stat-card:nth-child(2):before{background:rgba(22,163,74,.18)}.stat-card:nth-child(3){background:linear-gradient(135deg,#fff7ed,#ffffff)!important}.stat-card:nth-child(3):before{background:rgba(249,115,22,.18)}.stat-card:nth-child(4){background:linear-gradient(135deg,#fef2f2,#ffffff)!important}.stat-card:nth-child(4):before{background:rgba(220,38,38,.16)}.stat-card strong{letter-spacing:-1px}.stat-card{animation:softPop .38s ease both}.stat-card:nth-child(2){animation-delay:.04s}.stat-card:nth-child(3){animation-delay:.08s}.stat-card:nth-child(4){animation-delay:.12s}@keyframes softPop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}.income-card{margin-top:16px;background:linear-gradient(135deg,#0b1220,#1d2939)!important;color:#fff!important}.income-card h3,.income-card span{color:#e4e7ec!important}.income-card strong{color:#f7c948!important}

.size-picker{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #e6eaf2;box-shadow:0 14px 35px rgba(16,24,40,.06)}.size-picker h3{font-size:19px}.size-picker p{font-size:14px}.size-grid{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))!important}.size-option{min-height:58px;border-radius:18px;padding:9px 10px;position:relative;overflow:hidden;cursor:pointer;transition:.18s;background:#fff}.size-option span{font-size:16px;font-weight:950}.size-option input{width:62px!important;height:38px!important;border-radius:13px!important;font-weight:950;background:#f8fafc!important}.size-option:hover{border-color:#f7c948;box-shadow:0 10px 22px rgba(16,24,40,.08);transform:translateY(-1px)}.size-option.active{background:linear-gradient(135deg,#fff8df,#fff);border-color:#f7c948;box-shadow:0 10px 25px rgba(247,201,72,.20)}.size-option.active:after{content:"✓";position:absolute;top:6px;right:7px;background:#0b1220;color:#fff;width:22px;height:22px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:13px}.custom-size-row{background:#fff;border:1px dashed #cbd5e1;border-radius:18px;padding:10px;align-items:center}.size-summary{margin-top:12px;background:#0b1220;color:#fff;border-radius:18px;padding:12px 14px;font-weight:900;display:flex;justify-content:space-between;gap:10px;align-items:center}.size-summary small{color:#f7c948;font-weight:950}.sizes-chips{display:flex;flex-wrap:wrap;gap:7px}.sizes-chips .chip{display:inline-flex;align-items:center;border-radius:999px;padding:7px 10px;background:#eef2ff;color:#0b1220;font-weight:950;font-size:12px;margin:2px}.sizes-chips .chip.zero{background:#f1f5f9;color:#64748b}.sizes-chips .chip.ok{background:#dcfce7;color:#166534}

@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.stat-card{min-height:118px!important;padding:15px!important;border-radius:20px!important}.stat-card h3{font-size:12px!important}.stat-card strong{font-size:27px!important}.stat-card span{font-size:11px!important}.income-card{display:block!important}
  .form{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.form label{font-size:12px!important}.form input,.form select,.form textarea{padding:11px!important;border-radius:14px!important;font-size:14px!important}.form .full{grid-column:1/-1!important}.form textarea{min-height:66px}.form button.full,.form .btn.full{grid-column:1/-1!important}
  .size-picker{padding:13px!important}.size-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.size-option{min-height:52px!important;border-radius:15px!important}.size-option span{font-size:14px!important}.size-option input{width:54px!important;height:34px!important;padding:7px!important}.custom-size-row{grid-template-columns:1fr 78px!important;gap:8px!important}.size-summary{font-size:13px;padding:10px 12px}.table td:nth-child(5){min-width:220px}.sizes-chips .chip{font-size:11px;padding:6px 8px}
}
@media(max-width:430px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.stat-card{padding:13px!important;min-height:112px!important}.stat-card strong{font-size:24px!important}.form{grid-template-columns:repeat(2,minmax(0,1fr))!important}.form label{font-size:11px!important}.form input,.form select,.form textarea{font-size:13px!important;padding:10px!important}.size-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.custom-size-row{grid-template-columns:1fr 70px!important}.size-option{padding:8px!important}.size-option input{width:48px!important}.page-title h1{font-size:24px!important}
}


/* ===== FORCE 2 COLUMNS MOBILE PATCH 2026-05-31 ===== */
@media (max-width: 900px){
  .dashboard-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;width:100%!important}
  .dashboard-grid .stat-card{width:auto!important;min-width:0!important;margin:0!important}
  .income-card{margin-top:0!important}
  form.form{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;width:100%!important}
  form.form label{min-width:0!important;width:100%!important}
  form.form .full{grid-column:1 / -1!important}
  .size-picker .size-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .size-option{display:grid!important;grid-template-columns:1fr 54px!important;align-items:center!important}
}
@media (max-width: 430px){
  .dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .dashboard-grid .stat-card{min-height:105px!important;padding:12px!important;border-radius:18px!important}
  .dashboard-grid .stat-card strong{font-size:22px!important}
  .dashboard-grid .stat-card h3{font-size:11px!important}
  .dashboard-grid .stat-card span{font-size:10px!important}
  form.form{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .size-picker .size-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* FORCE 2 COLUMNS ON MOBILE FOR DASHBOARD + FORMS + COSTUME CARDS */
@media (max-width: 800px){
  .grid,
  .dashboard-grid,
  .product-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .product-card{
    min-width:0!important;
    padding:8px!important;
    border-radius:16px!important;
  }
  .product-card img{
    height:105px!important;
    border-radius:13px!important;
  }
  .product-card h3{
    font-size:12px!important;
    line-height:1.2!important;
    margin:7px 0 4px!important;
  }
  .size-line{font-size:11px!important;margin:3px 0 6px!important;}
  .product-meta{
    display:grid!important;
    grid-template-columns:1fr 1fr auto!important;
    align-items:center!important;
    gap:5px!important;
  }
  .price-pill,.stock-pill{
    font-size:10px!important;
    padding:6px 7px!important;
    white-space:nowrap!important;
  }
  .plus{width:30px!important;height:30px!important;font-size:18px!important;}
  .form,
  form.form,
  .size-grid,
  .size-picker .size-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .form .full,
  form.form .full,
  .size-picker,
  .table-wrap{
    grid-column:1 / -1!important;
  }
  .pos-toolbar,
  .two-inputs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .pos-layout{display:block!important;}
  .pos-products{padding:10px!important;}
}
@media (max-width: 380px){
  .product-card img{height:92px!important;}
  .price-pill,.stock-pill{font-size:9px!important;padding:5px!important;}
  .product-card h3{font-size:11px!important;}
}

/* Selected rental cart: image only in preview field */
.selected-box.image-only{
  min-height:140px;
  padding:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#111827;
  border:1px solid rgba(255,255,255,.12);
  overflow:hidden;
}
.selected-box.image-only img{
  width:100%;
  height:140px;
  object-fit:contain;
  object-position:center center;
  border-radius:14px;
  display:block;
  background:#0b1220;
}
.selected-box.image-only .empty-msg{
  color:#94a3b8;
  font-size:13px;
}
.selected-info{
  margin:8px 0 12px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
}
.selected-info:empty{display:none;}
.selected-info b{display:block;margin-bottom:4px;}
.selected-info span{display:inline-flex;margin-top:4px;}
.selected-info p{margin:8px 0 0;line-height:1.55;color:#dbeafe;}
@media(max-width:700px){
  .selected-box.image-only{min-height:118px;}
  .selected-box.image-only img{height:118px;object-fit:contain!important;}
}

/* One costume card with clear selectable sizes */
.costume-card{display:block!important;cursor:default!important;}
.costume-card.disabled{opacity:1!important;filter:none!important;}
.rent-size-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:8px 0 10px;}
.rent-size{border:1px solid #d9dee8;background:#fff;border-radius:14px;padding:8px 6px;display:flex;align-items:center;justify-content:space-between;gap:5px;cursor:pointer;font-weight:950;color:#0b1220;transition:.18s;min-height:40px;}
.rent-size b{font-size:13px;}
.rent-size span{font-size:11px;background:#eef2ff;border-radius:999px;padding:4px 6px;white-space:nowrap;}
.rent-size:hover,.rent-size.selected{border-color:#f0b429;background:#fff8df;box-shadow:0 8px 18px rgba(16,24,40,.12);transform:translateY(-1px);}
.rent-size.disabled{background:#f1f5f9;color:#94a3b8;border-color:#e2e8f0;cursor:pointer;}
.rent-size.disabled span{background:#fee2e2;color:#991b1b;}
.one-image-meta{margin-top:8px;}
.selected-box.image-only img{width:100%!important;height:130px!important;object-fit:contain!important;background:#111827;border-radius:16px;display:block;}
@media(max-width:1180px){.rent-size-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:800px){.rent-size-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.product-card img{height:100px!important}.rent-size{padding:7px 5px;min-height:36px}.rent-size b{font-size:12px}.rent-size span{font-size:10px;padding:3px 5px}.selected-box.image-only img{height:120px!important}}
@media(max-width:430px){.rent-size-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.product-card{padding:8px!important}.product-card img{height:86px!important}.product-card h3{font-size:11px!important}.size-line{font-size:10px!important}.one-image-meta{display:grid!important;grid-template-columns:1fr!important;gap:5px!important}.price-pill,.stock-pill{font-size:9px!important;padding:5px 6px!important}}


/* Admin shop switcher */
.shop-switch{margin:14px 0 18px;padding:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);border-radius:16px}
.shop-switch label{display:block;color:#cbd5e1;font-size:12px;font-weight:800;margin-bottom:7px}
.shop-switch select{width:100%;border:1px solid rgba(255,255,255,.16);border-radius:13px;padding:10px 12px;background:#fff;color:#0f172a;font-weight:800;outline:none}
.active-shop-banner{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:0 0 16px;padding:14px 18px;border-radius:20px;background:linear-gradient(135deg,#ffd447,#fff3b0);box-shadow:0 18px 35px rgba(15,23,42,.08);font-weight:900;color:#0f172a}
.active-shop-banner small{display:block;color:#475569;font-weight:800;margin-top:3px}
@media(max-width:760px){.shop-switch{margin:10px 14px}.active-shop-banner{margin:0 0 12px;border-radius:16px;padding:12px}.active-shop-banner{font-size:13px}}

/* Quick client modal from rental page */
.add-client-inline{width:100%;margin:8px 0 10px 0;background:#ffd047;color:#07101f;border:none;border-radius:14px;font-weight:900;padding:12px 14px;box-shadow:0 8px 18px rgba(255,208,71,.22)}
.modal-backdrop{position:fixed;inset:0;background:rgba(5,12,24,.68);backdrop-filter:blur(8px);z-index:9999;display:none;align-items:center;justify-content:center;padding:16px}
.modal-backdrop.show{display:flex;animation:fadeIn .18s ease both}
.modal-card{width:min(720px,96vw);background:#fff;border-radius:26px;box-shadow:0 28px 70px rgba(0,0,0,.28);padding:18px;color:#07101f;animation:popIn .2s ease both}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.modal-head h2{margin:0;font-size:24px;font-weight:1000}
.modal-close{width:42px;height:42px;border-radius:14px;border:0;background:#101828;color:#fff;font-size:26px;line-height:1;cursor:pointer}
.quick-client-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.quick-client-form label{font-weight:900;font-size:14px;display:flex;flex-direction:column;gap:7px}
.quick-client-form input,.quick-client-form textarea{width:100%;border:1px solid #d9e1ef;border-radius:14px;padding:12px 13px;font:inherit;background:#fff;outline:none}
.quick-client-form input:focus,.quick-client-form textarea:focus{border-color:#ffd047;box-shadow:0 0 0 4px rgba(255,208,71,.18)}
.quick-client-form .full{grid-column:1/-1}
.modal-msg{font-weight:900;color:#516078;min-height:22px}
.modal-msg .error{color:#e21b2d}
body.modal-open{overflow:hidden}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:640px){.modal-card{border-radius:22px;padding:14px}.quick-client-form{grid-template-columns:1fr 1fr;gap:10px}.quick-client-form label{font-size:12px}.quick-client-form input,.quick-client-form textarea{padding:10px 11px;border-radius:12px}.modal-head h2{font-size:19px}}

/* Costume Lm3alam upload helpers */
.mobile-only{display:none!important}
.btn.small{padding:8px 12px;border-radius:12px;font-size:12px;display:inline-flex;text-decoration:none;align-items:center;justify-content:center}
label small{display:block;color:#667085;font-weight:700;font-size:12px;margin-top:3px;margin-bottom:6px}
@media (max-width: 768px){
  .mobile-only{display:flex!important;flex-direction:column}
}
@media (min-width: 769px){
  .mobile-only{display:none!important}
}


/* Camera CIN mobile fix */
.mobile-camera-field{display:none!important;flex-direction:column;gap:8px}
.camera-file-input{display:none!important}
.camera-open-btn{border:0;border-radius:16px;padding:13px 14px;font-weight:900;background:linear-gradient(135deg,#111827,#374151);color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.16)}
.camera-ok{display:block;color:#16a34a;font-weight:900;margin-top:4px}
.camera-modal{position:fixed;inset:0;z-index:9999;background:rgba(3,7,18,.78);display:none;align-items:center;justify-content:center;padding:14px}
.camera-modal.show{display:flex}
.camera-box{width:min(520px,100%);background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 28px 90px rgba(0,0,0,.35)}
.camera-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:#111827;color:#fff}
.camera-close{width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:#111827;font-size:24px;font-weight:900}
.camera-video{width:100%;max-height:62vh;background:#000;display:block;object-fit:contain}
.camera-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px}
.camera-help{font-size:12px;color:#64748b;padding:0 14px 14px;line-height:1.35}
@media(max-width:768px){.mobile-camera-field{display:flex!important}}
@media(min-width:769px){.mobile-camera-field{display:none!important}}

/* === Rental modern mobile: hidden available sizes until Taille button === */
.rental-product-grid{align-items:start}
.rental-costume-card{overflow:hidden;border:1px solid rgba(15,23,42,.08);background:linear-gradient(180deg,#fff,#f8fafc);position:relative}
.rental-costume-card.selected{outline:3px solid rgba(247,201,72,.55);box-shadow:0 18px 44px rgba(15,23,42,.15)}
.costume-thumb-wrap{background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-radius:20px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.costume-thumb-wrap img{width:100%;height:150px;object-fit:contain!important;display:block}
.rental-card-body h3{margin:8px 0 8px;font-size:15px;line-height:1.2;color:#0f172a}
.rental-card-meta{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.size-toggle-btn{width:100%;border:0;border-radius:16px;padding:12px 10px;background:linear-gradient(135deg,#0f172a,#334155);color:white;font-weight:950;display:flex;justify-content:space-between;align-items:center;box-shadow:0 12px 25px rgba(15,23,42,.18);cursor:pointer;transition:.2s}
.size-toggle-btn b{background:#f7c948;color:#0f172a;border-radius:999px;padding:3px 8px;font-size:12px}
.size-toggle-btn.open{background:linear-gradient(135deg,#b45309,#f59e0b)}
.hidden-sizes{display:none!important}.show-sizes{display:grid!important;animation:sizeDrop .22s ease both}
@keyframes sizeDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.available-size{background:linear-gradient(180deg,#ecfdf5,#fff)!important;border-color:#86efac!important;color:#14532d!important}
.available-size span{background:#dcfce7!important;color:#166534!important}
.no-size-available{border:1px dashed #fecaca;background:#fff1f2;color:#991b1b;border-radius:16px;padding:12px;font-weight:950;text-align:center;font-size:13px}
@media(max-width:768px){.rental-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.costume-thumb-wrap img{height:112px!important}.rental-costume-card{padding:9px!important;border-radius:18px!important}.rental-card-body h3{font-size:12px!important}.size-toggle-btn{font-size:11px!important;padding:10px 8px!important;border-radius:13px!important}.rent-size-grid.show-sizes{grid-template-columns:repeat(2,minmax(0,1fr))!important}.rent-size{font-size:11px!important}}
@media(max-width:430px){.costume-thumb-wrap img{height:94px!important}.rental-card-meta{display:grid;grid-template-columns:1fr;gap:5px}.stock-pill,.price-pill{font-size:9px!important;text-align:center!important}.rent-size b{font-size:11px!important}.rent-size span{font-size:9px!important}}

/* === Modern client upload buttons === */
.upload-choice{background:linear-gradient(135deg,#ffffff,#f8fafc);border:1px solid #e5e7eb;border-radius:22px;padding:14px;box-shadow:0 10px 24px rgba(15,23,42,.06)}
.upload-title{font-weight:950;color:#0f172a;margin-bottom:10px}
.upload-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.upload-btn{border:0;border-radius:16px;padding:13px 12px;font-weight:950;cursor:pointer;transition:.2s;min-height:48px;box-shadow:0 10px 24px rgba(15,23,42,.10)}
.storage-btn{background:linear-gradient(135deg,#eef2ff,#dbeafe);color:#1e3a8a}
.camera-btn{background:linear-gradient(135deg,#111827,#374151);color:#fff}
.upload-btn:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,23,42,.16)}
.real-file-input{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.file-name-preview{display:block;margin-top:9px;color:#475569;font-weight:850;font-size:12px;word-break:break-word}.modern-submit{font-size:16px!important;min-height:52px}.quick-upload-choice{grid-column:1/-1}.mobile-only-camera{display:none!important}@media(max-width:768px){.mobile-only-camera{display:block!important}.upload-actions{grid-template-columns:1fr 1fr}.upload-btn{font-size:12px!important;padding:11px 9px!important}}@media(min-width:769px){.mobile-only-camera{display:none!important}.upload-actions{grid-template-columns:1fr}}

/* === Articles editable rows + mixed rental cart === */
.type-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 8px;background:linear-gradient(135deg,#fef3c7,#fde68a);color:#78350f;font-weight:950;font-size:11px}
.cart-list{display:grid;gap:8px;margin:10px 0}
.cart-item{display:grid;grid-template-columns:1fr auto 32px;gap:8px;align-items:center;border:1px solid rgba(15,23,42,.09);background:linear-gradient(135deg,#fff,#f8fafc);border-radius:14px;padding:9px;font-size:12px;font-weight:850;color:#0f172a}
.cart-item b{white-space:nowrap;color:#92400e}.cart-item button{width:30px;height:30px;border:0;border-radius:10px;background:#fee2e2;color:#991b1b;font-weight:1000;font-size:18px;cursor:pointer}.rent-size.selected{outline:3px solid rgba(34,197,94,.35)!important;background:linear-gradient(135deg,#22c55e,#15803d)!important;color:#fff!important}.rent-size.selected span{background:rgba(255,255,255,.22)!important;color:#fff!important}
.editable-costume-table td{vertical-align:top}.article-edit-thumb{width:86px!important;height:100px!important;object-fit:contain!important;background:#f8fafc;border-radius:14px;border:1px solid #e5e7eb}.inline-edit-form{margin:0}.inline-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:360px}.inline-fields label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:900;color:#334155}.inline-fields input,.inline-fields select{border:1px solid #d9e1ef;border-radius:10px;padding:8px 9px;font:inherit;background:#fff}.inline-fields .full{grid-column:1/-1}.btn.small{width:100%;min-width:86px;text-align:center}
@media(max-width:768px){.inline-fields{grid-template-columns:repeat(2,minmax(0,1fr));min-width:260px}.article-edit-thumb{width:70px!important;height:82px!important}.editable-costume-table{font-size:11px}.inline-fields input,.inline-fields select{padding:7px;font-size:11px}.cart-item{font-size:11px;grid-template-columns:1fr auto 28px}.cart-item button{width:28px;height:28px}}

/* === Client page: rental activity by CIN / phone / name === */
.client-activity-panel{background:linear-gradient(135deg,#ffffff,#f8fafc);border-radius:24px;padding:16px;box-shadow:0 18px 45px rgba(15,23,42,.08);border:1px solid rgba(15,23,42,.06);animation:fadeIn .2s ease both}
.activity-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.activity-head h2{margin:0;font-size:22px;font-weight:1000;color:#0f172a}
.activity-head p{margin:4px 0 0;color:#64748b;font-weight:750;font-size:13px}
.activity-count{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:linear-gradient(135deg,#f7c948,#f59e0b);color:#0f172a;font-weight:1000;padding:9px 13px;white-space:nowrap;box-shadow:0 10px 24px rgba(245,158,11,.18)}
.client-activity-table .articles-cell{font-weight:850;line-height:1.55;color:#0f172a;min-width:180px}.rest-danger{color:#dc2626;font-weight:1000}.rest-ok{color:#16a34a;font-weight:1000}.status-badge{display:inline-flex;border-radius:999px;padding:6px 10px;font-weight:1000;font-size:11px;background:#eef2ff;color:#3730a3}.status-returned{background:#dcfce7;color:#166534}.status-active{background:#fff7ed;color:#9a3412}.status-late{background:#fee2e2;color:#991b1b}.status-cancelled{background:#f1f5f9;color:#475569}
@media(max-width:768px){.activity-head{align-items:flex-start;flex-direction:column}.activity-head h2{font-size:18px}.activity-count{font-size:12px}.client-activity-panel{padding:12px;border-radius:20px}.activity-table-wrap{overflow-x:auto}.client-activity-table{font-size:11px;min-width:980px}}

/* Multi rental cart: one client can rent for himself, brother, father... */
.selected-info small{display:block;color:#9aa7bd;margin-top:4px;font-size:12px}
.multi-rent-item{display:block;padding:10px;border-radius:14px;background:#fff;box-shadow:0 8px 20px rgba(2,12,27,.08);margin-bottom:10px}
.pos-cart .multi-rent-item{background:#1b2434;border:1px solid rgba(255,255,255,.08)}
.cart-item-head{display:grid;grid-template-columns:1fr auto 34px;gap:8px;align-items:center;margin-bottom:8px}
.cart-item-head em{font-style:normal;color:#22c55e;font-size:12px}
.multi-rent-item input{width:100%;height:38px;border-radius:12px;border:1px solid #d8e0ef;padding:0 12px;font-weight:700}
.pos-cart .multi-rent-item input{background:#0f1726;color:#fff;border-color:#2f3a4d}
.cart-free-note{font-size:12px;color:#22c55e;font-weight:800}
@media(max-width:700px){.cart-item-head{grid-template-columns:1fr 1fr 30px}.multi-rent-item input{height:36px;font-size:12px}}

/* Cart: multiple article images + shoes included logic UI */
.cart-images-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  width:100%;
}
.cart-image-tile{
  background:#111827;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:8px;
  min-height:110px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.cart-image-tile img{
  width:100%;
  height:86px;
  object-fit:contain;
  border-radius:12px;
  background:#eef2f7;
}
.cart-image-tile small{
  color:#fff;
  font-size:11px;
  margin-top:6px;
  width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:center;
}
.cart-item-row{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.cart-item-thumb{
  width:58px;
  height:58px;
  object-fit:contain;
  background:#eef2f7;
  border-radius:12px;
  flex:0 0 58px;
}
.cart-item-main{
  min-width:0;
  flex:1;
}
.cart-item-head em{
  color:#16a34a;
  font-style:normal;
  font-weight:900;
}
@media(max-width:760px){
  .cart-images-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .cart-image-tile img{height:74px;}
  .cart-item-thumb{width:52px;height:52px;}
}

/* ===== FINAL UX PATCH: clients actions, clear sizes, article table ===== */
.client-actions-card{background:#fff;border-radius:24px;padding:18px;margin-bottom:16px;box-shadow:0 14px 34px rgba(16,24,40,.08)}
.client-action-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px}.client-action-buttons .btn{width:100%;text-align:center;font-size:15px;border-radius:16px;padding:14px 18px}.dark-action{background:#0b1220!important;color:#fff!important}.client-search-box{display:none;margin-top:14px}.client-search-box.show{display:block}.client-search-box label{font-weight:900}.client-search-box input{width:100%;margin-top:8px;padding:15px;border:1px solid #d9e1ef;border-radius:16px;font-size:16px}.client-list-wrap{margin-top:14px}.activity-head{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-radius:22px 22px 0 0;padding:16px 18px;margin-top:18px}.activity-head h2{margin:0}.activity-head p{margin:4px 0 0;color:#667085;font-weight:700}.activity-count{background:#f7c948;color:#0b1220;border-radius:999px;padding:8px 12px;font-weight:1000}.rest-danger{color:#dc2626;font-weight:1000}.rest-ok{color:#16a34a;font-weight:1000}

.article-form{grid-template-columns:repeat(4,minmax(0,1fr))!important}.article-form .article-photo-field{grid-column:span 2}.sizes-open-btn{width:100%;border-radius:18px;padding:14px 18px;font-size:16px}.size-picker.collapsed{display:none!important}.clear-size-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}.clear-size-option{background:#f8fafc;border:2px solid #e2e8f0!important;border-radius:18px!important;min-height:58px;transition:.18s}.clear-size-option span{font-size:16px;font-weight:1000}.clear-size-option input{background:#fff!important;border-radius:14px!important;text-align:center!important;font-weight:1000}.clear-size-option.active{background:#ecfdf3!important;border-color:#22c55e!important;box-shadow:0 10px 24px rgba(34,197,94,.16)}

.articles-edit-table{min-width:1250px}.articles-edit-table th{font-size:13px;text-transform:uppercase;letter-spacing:.02em}.articles-edit-table td{vertical-align:top}.articles-edit-table input,.articles-edit-table select{width:100%;border:1px solid #d9e1ef;border-radius:12px;padding:10px 11px;font-weight:800;background:#fff}.article-edit-thumb{width:78px!important;height:78px!important;object-fit:contain!important;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px}.size-row-toggle{white-space:nowrap;margin-bottom:8px}.row-size-editor{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;min-width:360px}.row-size-editor.collapsed{display:none}.row-size-pill{display:grid;grid-template-columns:1fr 58px;align-items:center;gap:6px;padding:7px;border-radius:14px;border:1px solid #dbe4f0;background:#f8fafc;font-weight:1000}.row-size-pill.ok{background:#dcfce7;border-color:#86efac}.row-size-pill.zero{background:#f1f5f9;color:#64748b}.row-size-pill small{display:block;font-size:9px;color:#64748b}.row-size-pill input{padding:7px!important;text-align:center!important;border-radius:10px!important}.articles-edit-table small{display:block;color:#667085;font-size:11px;margin-top:5px}

/* Rental size buttons: clearer, only available sizes appear after click */
.rent-size-grid.hidden-sizes{display:none!important}.rent-size-grid.show-sizes{display:grid!important}.size-toggle-btn{width:100%;margin-top:12px;border:0;border-radius:18px;padding:14px 16px;background:#142033;color:#fff;font-weight:1000;display:flex;align-items:center;justify-content:space-between;box-shadow:0 10px 22px rgba(15,23,42,.13);cursor:pointer}.size-toggle-btn b{background:#f7c948;color:#0b1220;min-width:30px;height:30px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center}.size-toggle-btn.open{background:linear-gradient(135deg,#e67800,#f7c948);color:#0b1220}.rent-size.available-size{background:#ecfdf3!important;border:2px solid #86efac!important;color:#065f46!important;border-radius:18px!important;padding:10px!important;box-shadow:0 8px 18px rgba(22,163,74,.12)}.rent-size.available-size b{font-size:16px!important}.rent-size.available-size span{background:#bbf7d0!important;color:#065f46!important;font-weight:1000}.rent-size.available-size.selected{background:#16a34a!important;color:#fff!important;border-color:#15803d!important}.rent-size.available-size.selected span{background:#fff!important;color:#065f46!important}.no-size-available{margin-top:12px;background:#fee2e2;color:#991b1b;padding:10px;border-radius:14px;font-weight:900}

@media(max-width:1100px){.article-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}.clear-size-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:760px){.client-action-buttons{grid-template-columns:1fr 1fr!important}.client-action-buttons .btn{font-size:13px;padding:12px 10px}.article-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}.clear-size-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.row-size-editor{grid-template-columns:repeat(2,minmax(0,1fr));min-width:260px}.articles-edit-table{min-width:1050px}.activity-head{align-items:flex-start;flex-direction:column}}


/* FINAL FIX: rented/unavailable sizes are visible but disabled in gray */
.rent-size.rented-size,
.rent-size.rented-size:disabled{
    background:linear-gradient(135deg,#e5e7eb,#cbd5e1)!important;
    border:2px solid #cbd5e1!important;
    color:#64748b!important;
    cursor:not-allowed!important;
    pointer-events:none!important;
    opacity:.95!important;
    box-shadow:none!important;
}
.rent-size.rented-size b{color:#64748b!important;}
.rent-size.rented-size span{background:#f1f5f9!important;color:#64748b!important;font-weight:1000!important;}
.rent-size.rented-size:hover{transform:none!important;box-shadow:none!important;}
.rent-size.available-size{cursor:pointer!important;}
.size-toggle-btn b{min-width:36px!important;padding:0 8px!important;}