/* Wolt-inspired Filipino theme */
:root{
	--bg:#FFF8F0; /* cream background */
	--card:#ffffff;
	--accent:#B11226; /* Deep Red */
	--accent-2:#FFC72C; /* Warm Yellow */
	--text:#2B2B2B; /* Dark Charcoal */
	--muted:#6b6b6b;
	--radius:14px;
}
.html, body { height: 100%; }
html,body{height:100%;}
body{ display:flex; flex-direction:column; min-height:100vh; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; padding:0; background:var(--bg); color:var(--text) }
.container{ max-width:1100px; margin:0 auto; padding:20px }
main.container{ flex:1 0 auto }
.site-header{ background:linear-gradient(90deg,var(--accent),#8f0f17); color:#fff; padding:14px 0; box-shadow:0 4px 18px rgba(0,0,0,0.08); position:sticky; top:0; z-index:50 }
.site-header .container{ display:flex; align-items:center; gap:16px }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:#fff }
.brand .logo{ width:44px; height:44px; background:var(--accent-2); color:var(--text); border-radius:8px; display:flex; align-items:center; justify-content:center; font-weight:800 }
.site-header nav{ margin-left:auto }
.site-header nav a{ color:#fff; text-decoration:none; margin-left:14px; font-weight:600 }
.searchbar{ margin-left:20px; flex:0 0 360px }
.searchbar input{ width:100%; padding:10px 12px; border-radius:10px; border:0; box-shadow:0 2px 8px rgba(0,0,0,0.06) }

.hero{ background:linear-gradient(180deg, rgba(177,18,38,0.06), rgba(255,199,44,0.03)); border-radius:var(--radius); padding:28px; display:flex; gap:20px; align-items:center; margin:18px 0 }
.hero .left{ flex:1 }
.hero h2{ margin:0 0 8px 0; font-size:28px }
.hero p{ margin:0 0 14px 0; color:var(--muted) }
.hero .cta{ display:inline-block; background:var(--accent); color:#fff; padding:10px 14px; border-radius:10px; text-decoration:none }
.hero .right{ width:240px }
.pattern{ opacity:0.95; width:100%; height:120px; border-radius:10px; background:#fff; display:flex; align-items:center; justify-content:center }

.categories{ display:flex; gap:10px; overflow:auto; padding-bottom:10px }
.categories .cat{ background:var(--card); padding:8px 12px; border-radius:10px; box-shadow:0 6px 14px rgba(16,24,40,0.04); white-space:nowrap }

/* Category tiles like the reference: horizontal scrollable tiles with icon + label */
.categories-row{ display:flex; gap:14px; overflow:auto; padding:8px 4px; align-items:center }
.category-tile{ display:flex; flex-direction:column; align-items:center; justify-content:center; width:120px; min-width:120px; height:92px; background:#0b3b25; color:#fff; text-decoration:none; border-radius:12px; box-shadow:0 8px 28px rgba(11,56,37,0.12); padding:10px; transition:transform .14s ease; }
.category-tile:hover{ transform:translateY(-6px) }
.category-tile .cat-icon{ width:56px; height:56px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:8px; overflow:hidden }
.category-tile .cat-icon img{ width:48px; height:48px; object-fit:contain; display:block }
.category-tile .cat-svg{ width:48px; height:48px; display:block }
.category-tile .cat-label{ font-size:13px; color:#fff; font-weight:700; text-align:center }

.menu-grid{ display:grid; gap:16px; margin-top:12px; grid-template-columns: repeat(2,1fr); }
@media(min-width:768px){
	.menu-grid{ grid-template-columns: repeat(3,1fr); }
}
@media(min-width:1100px){
	.menu-grid{ grid-template-columns: repeat(4,1fr); }
}

/* Carousel (used for Best seller) */
.carousel{ position:relative; margin-top:8px; padding:0 56px; overflow:visible }
.carousel-viewport{ overflow:hidden }
.carousel-track{ display:flex; gap:16px; transition:transform .36s cubic-bezier(.2,.9,.2,1); will-change:transform }
.carousel-item{ flex:0 0 50%; box-sizing:border-box }
.carousel-nav{ position:absolute; top:50%; left:0; right:0; pointer-events:none }
.carousel-button{ position:absolute; top:50%; transform:translateY(-50%); pointer-events:auto; background:var(--accent); color:#fff; border:0; width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:10px; cursor:pointer; box-shadow:0 8px 20px rgba(177,18,38,0.14); font-weight:700; z-index:40 }
.carousel-button.left{ left:8px }
.carousel-button.right{ right:8px }
.carousel-button{ z-index:60 }
.carousel-button:disabled{ opacity:0.45; cursor:default }

/* Dots */
.carousel-dots{ display:flex; gap:8px; justify-content:center; margin-top:12px }
.carousel-dot{ width:10px; height:10px; border-radius:999px; background:rgba(16,24,40,0.12); cursor:pointer }
.carousel-dot.active{ background:var(--accent-2); box-shadow:0 4px 12px rgba(177,18,38,0.08) }

@media(min-width:768px){
	.carousel-item{ flex:0 0 33.3333% }
}
@media(min-width:1100px){
	.carousel-item{ flex:0 0 25% }
}

/* make images inside carousel items consistent */
.carousel-item .menu-item img{ height:130px }
.menu-item{ background:var(--card); padding:14px; border-radius:12px; box-shadow:0 10px 24px rgba(16,24,40,0.04); display:flex; flex-direction:column; gap:8px }
.menu-item img{ width:100%; height:140px; object-fit:cover; border-radius:8px; display:block; filter:none; opacity:1 }
.menu-item h3{ margin:0; font-size:16px }
.menu-item h3 a{ color:var(--accent); text-decoration:none }
.menu-item h3 a:hover{ text-decoration:underline; color:darken(var(--accent),10%) }
.menu-item .meta{ display:flex; justify-content:space-between; align-items:center }
.menu-item .price{ font-weight:700; color:var(--accent) }
.menu-item .btn{ background:var(--accent); color:#fff; padding:8px 10px; border-radius:10px; border:0 }
.menu-item.unavailable{ opacity:1 }
.menu-item.unavailable img{ filter:grayscale(10%) contrast(1.02) saturate(0.95); opacity:1 }
.menu-item.unavailable .price{ color:var(--muted) }
.menu-item.unavailable .btn{ opacity:0.8 }

/* single food page image */
.food-image{ width:100%; max-width:520px; height:auto; border-radius:10px; display:block; margin-bottom:12px; box-shadow:0 8px 24px rgba(16,24,40,0.06) }

/* Food page two-column layout */
.food-grid{ display:grid; grid-template-columns: 1fr 420px; gap:28px; align-items:start; margin-top:16px }
.food-left .food-image.placeholder{ width:100%; height:420px; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg,#fafafa,#f5f3f2); border-radius:10px; color:var(--muted) }
.food-right .food-title{ margin-top:0; margin-bottom:10px }
.price-box{ background:#fff; color:var(--accent); font-weight:800; padding:10px 14px; border-radius:10px; display:inline-block; box-shadow:0 6px 18px rgba(16,24,40,0.06); margin-bottom:14px }
.desc-box{ background:var(--card); padding:14px; border-radius:10px; border:1px solid rgba(16,24,40,0.03); margin-bottom:16px }
.order-row{ display:flex; gap:12px; align-items:flex-end }
.order-qty input[type=number]{ width:120px; padding:8px; border-radius:8px; border:1px solid rgba(16,24,40,0.06); }
.order-qty label{ font-weight:600; color:var(--text); display:block }
.order-action .btn{ padding:12px 18px }

/* Order now button styling (primary attention) */
.btn-order-now{ background:var(--accent-2); color:var(--text); margin-right:8px }

@media(max-width:900px){
	.food-grid{ grid-template-columns:1fr; }
	.order-row{ flex-direction:row; }
}

.floating-cart{ position:fixed; right:20px; bottom:20px; background:var(--accent); color:#fff; padding:12px 16px; border-radius:999px; box-shadow:0 10px 30px rgba(0,0,0,0.15); z-index:60 }

table{ width:100%; border-collapse:collapse }
table th, table td{ padding:10px; border-bottom:1px solid rgba(16,24,40,0.04) }

.site-footer{ background:#111; color:#fff; padding:18px 0; margin-top:28px; border-radius:0 }
.site-footer .container{ padding-left:20px; padding-right:20px }

/* Footer grid */
.footer-grid{ display:grid; grid-template-columns: 1fr 1.6fr; gap:28px; align-items:start; padding:28px 0 }
.footer-left{ display:flex; flex-direction:column; gap:16px }
.footer-brand{ display:flex; gap:12px; align-items:center }
.footer-brand .logo{ width:56px; height:56px; background:var(--accent-2); color:var(--text); border-radius:8px; display:flex; align-items:center; justify-content:center; font-weight:800 }
.footer-brand .footer-banner{ max-width:280px; height:auto; display:block; border-radius:8px }
.footer-brand .brand-text .lead{ font-size:13px; opacity:0.9 }

.newsletter label{ display:block; font-weight:700; margin-bottom:6px }
.newsletter-row{ display:flex; gap:8px; align-items:center }
.newsletter-row input{ padding:10px 12px; border-radius:8px; border:0; width:220px }
.newsletter-row .btn{ padding:10px 12px; border-radius:8px }

.footer-cols{ display:flex; gap:28px }
.footer-cols .col{ min-width:140px }
.footer-cols h4{ margin:0 0 8px 0; font-size:15px }
.footer-cols a{ display:block; color:rgba(255,255,255,0.84); text-decoration:none; margin-bottom:8px }
.footer-cols a:hover{ text-decoration:underline }

.footer-bottom{ border-top:1px solid rgba(255,255,255,0.04); margin-top:18px; padding:12px 0 }
.footer-bottom-inner{ display:flex; justify-content:space-between; align-items:center }
.social .social-icon{ display:inline-block; width:34px; height:34px; line-height:34px; text-align:center; border-radius:6px; background:rgba(255,255,255,0.06); color:#fff; margin-left:8px; text-decoration:none }

@media(max-width:900px){
	.footer-grid{ grid-template-columns:1fr; }
	.footer-cols{ flex-direction:row; gap:12px; overflow:auto }
	.newsletter-row input{ width:160px }
}

@media(max-width:800px){
	.container{ padding:12px }
	.searchbar{ display:none }
	.hero{ flex-direction:column }
	.hero .right{ display:none }
}

/* Auth forms */
.auth-card{
	max-width:420px;
	margin:36px auto;
	padding:28px;
	background:var(--bg);
	border-radius:12px;
	box-shadow:0 8px 22px rgba(43,43,43,0.06);
	border:1px solid rgba(43,43,43,0.04);
}
.auth-card h2{ margin-top:0; color:var(--text); font-size:22px }
.auth-card p.lead{ color:var(--muted); margin-bottom:14px }
.auth-card label{ display:block; margin-bottom:12px; color:var(--text); font-weight:600 }
.auth-card input[type="text"], .auth-card input[type="email"], .auth-card input[type="password"], .auth-card textarea{
	width:100%; padding:12px; border-radius:8px; border:1px solid rgba(43,43,43,0.08); background:#fff; box-sizing:border-box
}
.auth-actions{ display:flex; align-items:center; justify-content:space-between; margin-top:10px }
.auth-actions .btn{ background:var(--accent); color:#fff; padding:10px 16px; border-radius:8px; border:0 }
.auth-note{ font-size:13px; color:var(--muted); margin-left:12px }


/* Mobile header styles */
 .desktop-nav{ display:flex; gap:12px }
 .mobile-actions{ display:none; align-items:center; gap:12px; width:100%; justify-content:space-between }
 .hamburger{ background:transparent;border:0;padding:8px;display:flex;align-items:center;justify-content:center }
 .hamburger i{ color:#fff; font-size:20px }
 .mobile-cart i{ color:#fff; font-size:18px }
 .mobile-cart img.cart-icon{ width:20px; height:20px; display:block; object-fit:contain }
 .brand-mobile .logo{ width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center }
 .mobile-cart{ display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none }
 .mobile-cart .cart-count{ background:var(--accent-2); color:var(--text); padding:2px 6px;border-radius:12px;font-size:12px;margin-left:4px }

/* Desktop cart next to profile in header */
.desktop-cart{ color:#fff; display:inline-flex; align-items:center; gap:6px; margin-left:8px }
.desktop-cart .cart-count{ background:var(--accent-2); color:var(--text); padding:2px 6px;border-radius:12px;font-size:12px }
.desktop-cart img.cart-icon{ width:18px; height:18px; object-fit:contain; display:block }

/* mobile menu slide-in */
 .mobile-menu{ position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:70 }
 .mobile-menu .mobile-menu-inner{ position:absolute; left:0; top:0; width:280px; max-width:80%; height:100%; background:var(--card); box-shadow:8px 0 30px rgba(0,0,0,0.12); transform:translateX(-110%); transition:transform .28s ease; pointer-events:auto; color:var(--text); }
 .mobile-menu.open .mobile-menu-inner{ transform:translateX(0) }
 .mobile-menu .mobile-menu-header{ display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid rgba(0,0,0,0.05) }
 .mobile-cats{ display:flex;flex-direction:column;padding:12px; gap:6px }
 .mobile-cats .cat{ display:block; padding:12px 10px;border-radius:8px; background:rgba(0,0,0,0.03); text-decoration:none; color:var(--text) !important; font-weight:600; font-size:16px; line-height:1.4 }
 .mobile-cats .cat:hover{ background:rgba(0,0,0,0.06) }
 .mobile-cats .no-cats{ padding:12px; color:var(--muted); font-style:italic }
 .mobile-menu .close-menu{ background:transparent;border:0;font-size:22px;padding:6px }
 .mobile-menu .close-menu i{ font-size:20px }

@media(max-width:800px){
	.desktop-nav{ display:none }
	.mobile-actions{ display:flex }
	.brand{ display:none }
	.brand-mobile{ flex:1; display:flex; justify-content:center; align-items:center }
	.brand-mobile .logo{ width:40px; height:40px }
}

/* Profile button + dropdown */
.profile-btn{ cursor:pointer }
.profile-menu{ display:inline-block; position:relative; margin-left:12px }
.profile-menu .profile-dropdown{ position:absolute; right:0; top:44px; background:var(--card); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,0.08); padding:8px; min-width:160px; z-index:120; opacity:0; transform:translateY(-8px); visibility:hidden; transition:opacity .18s ease, transform .18s ease, visibility .18s; pointer-events:none }
.profile-menu.open .profile-dropdown{ opacity:1; transform:translateY(0); visibility:visible; pointer-events:auto }
.profile-dropdown a{ display:block; padding:8px 10px; color:var(--text) !important; text-decoration:none }
.profile-dropdown a:hover{ background:rgba(16,24,40,0.04); }
.profile-menu .profile-btn{ background:#fff; border:1px solid rgba(16,24,40,0.06); width:36px; height:36px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; font-weight:700; color:var(--text); cursor:pointer; }

/* Splash-style auth (mobile-first) */
.auth-splash{ max-width:420px; margin:18px auto; background:transparent; padding:0 }
.auth-splash .illustration{ background:linear-gradient(90deg,var(--accent),var(--accent-2)); border-radius:14px; padding:22px; display:flex; align-items:center; justify-content:center; color:#fff; margin-bottom:14px; box-shadow:0 10px 30px rgba(16,24,40,0.04) }
.auth-splash .illustration img{ max-width:220px; filter: none }
.auth-splash .auth-card{ background:var(--card); color:var(--text); padding:20px; border-radius:12px; box-shadow:0 8px 22px rgba(16,24,40,0.06); border:1px solid rgba(16,24,40,0.04) }
.auth-splash .auth-card label{ color:var(--text) }
.auth-splash .auth-card input{ background:#fff; border:1px solid rgba(16,24,40,0.06); color:var(--text) }
.auth-splash .auth-card .btn{ background:var(--accent); color:#fff }
.auth-splash .auth-card .btn.full{ width:100% }

@media(max-width:480px){
	.auth-splash .auth-card{ padding:18px }
	.auth-splash .illustration{ padding:20px }
	.auth-splash .auth-card .btn{ padding:12px 14px }
}

/* Admin dashboard styles */
.admin-dashboard{ padding:28px 0 }
.admin-card{ max-width:980px; margin:18px auto; background:#fff; border-radius:12px; padding:22px; box-shadow:0 22px 60px rgba(16,24,40,0.08); border:1px solid rgba(16,24,40,0.04) }
.admin-card h2{ margin-top:0; font-size:20px; color:var(--text); margin-bottom:12px }
.admin-menu{ list-style:none; padding-left:0; margin:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px }
.admin-menu li{ background:linear-gradient(180deg, #fff, #faf8f6); border-radius:12px; padding:12px; box-shadow:0 10px 30px rgba(16,24,40,0.06); transition:transform .14s ease, box-shadow .14s ease; display:flex; align-items:center }
.admin-menu li:hover{ transform:translateY(-6px); box-shadow:0 22px 54px rgba(16,24,40,0.12) }
.admin-menu a{ color:var(--accent); font-weight:700; text-decoration:none; display:block; width:100%; padding:12px }
.admin-menu a:hover{ text-decoration:none; }

/* decorative icon removed: links use clean text only */

/* make admin content readable on small screens */
@media(max-width:600px){
  .admin-card{ padding:16px; margin:12px }
  .admin-menu{ grid-template-columns:1fr }
}

/* Admin edit form styles */
.admin-edit-form{ width:100%; }
.admin-edit-form label{ display:block; margin-bottom:10px; color:var(--text); font-weight:600 }
.admin-edit-form input:not([type=checkbox]):not([type=file]), .admin-edit-form textarea, .admin-edit-form select{ width:100%; padding:10px; border-radius:8px; border:1px solid rgba(16,24,40,0.06); box-sizing:border-box; background:#fff }
.admin-edit-form textarea{ resize:vertical; max-width:none; min-height:120px }
.admin-edit-grid{ display:grid; grid-template-columns: 1fr 320px; gap:20px; align-items:start }
.admin-edit-right{ background:#fff; padding:18px; border-radius:12px; box-shadow:0 10px 30px rgba(16,24,40,0.06); }
.admin-image-preview{ width:100%; height:180px; object-fit:cover; border-radius:8px; display:block; margin-bottom:10px; background:linear-gradient(180deg, #fafafa,#f5f3f2); border:1px solid rgba(16,24,40,0.03) }
.admin-edit-form .form-row{ display:flex; gap:12px; align-items:center }
.admin-edit-form .form-row .col-2{ flex:0 0 150px }
.btn{ display:inline-block; padding:8px 12px; border-radius:8px; border:0; background:var(--accent); color:#fff; text-decoration:none; cursor:pointer }
.btn.secondary{ background:#fff; color:var(--text); border:1px solid rgba(16,24,40,0.06) }
.admin-edit-form .help{ font-size:13px; color:var(--muted); margin-top:6px }

@media(max-width:780px){
	.admin-edit-grid{ grid-template-columns:1fr }
	.admin-edit-right{ order:-1 }
}

/* Schedule manager specific styles */
.schedule-manager{ max-width:1200px; width:100%; margin:18px auto; padding:28px; background:linear-gradient(180deg,#fff,#fbfaf9); border-radius:12px; box-shadow:0 18px 50px rgba(16,24,40,0.06); border:1px solid rgba(16,24,40,0.04); }
.schedule-manager h3{ margin-top:0; font-size:18px; color:var(--text); margin-bottom:12px }
.schedule-manager form{ background:transparent; margin-bottom:18px }
.schedule-manager form label{ display:block; margin-bottom:10px; color:var(--text); font-weight:600 }
.schedule-manager form input[type="text"], .schedule-manager form input[type="date"], .schedule-manager form input[type="time"], .schedule-manager form select, .schedule-manager form input[type="number"], .schedule-manager form textarea{ width:100%; padding:10px; border-radius:8px; border:1px solid rgba(16,24,40,0.06); background:#fff; box-sizing:border-box }
.schedule-manager .form-row{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; align-items:end }
.schedule-manager .form-row .col-1{ grid-column: span 1 }
.schedule-manager .form-row .col-2{ grid-column: span 2 }
.schedule-manager .btn{ padding:10px 14px; border-radius:8px }
.schedule-manager .btn.small{ padding:8px 10px; font-size:14px }

.schedule-manager table{ width:100%; border-collapse:collapse; background:transparent; border-radius:8px; overflow:hidden }
.schedule-manager table th, .schedule-manager table td{ padding:12px 14px; border-bottom:1px solid rgba(16,24,40,0.04); text-align:left }
.schedule-manager table thead th{ background:linear-gradient(90deg,rgba(177,18,38,0.04),rgba(255,199,44,0.02)); font-weight:700; color:var(--text) }
.schedule-manager tbody tr:nth-child(even){ background: rgba(16,24,40,0.01) }
.schedule-manager tbody tr:hover{ background: rgba(177,18,38,0.03) }
.schedule-manager .empty-note{ color:var(--muted); padding:18px 0; text-align:center }

@media(min-width:1100px){
	/* wider two-column form on large screens */
	.schedule-manager .form-row{ grid-template-columns: repeat(2,1fr); gap:18px; }
	.schedule-manager .form-row .col-2{ grid-column: span 2 }
}

/* Checkout modern mobile-first styles */
.checkout-card{ background:#fff; border-radius:14px; padding:16px; box-shadow:0 18px 40px rgba(16,24,40,0.06); border:1px solid rgba(16,24,40,0.04); }
.checkout-toggle{ display:flex; gap:8px; background:linear-gradient(180deg,#fff,#fbfaf9); padding:8px; border-radius:999px; align-items:center }
.checkout-toggle button{ flex:1; padding:10px 12px; border-radius:999px; border:0; background:transparent; font-weight:700 }
.checkout-toggle .active{ background:var(--accent); color:#fff }
.checkout-address{ margin-top:12px; padding:12px; border-radius:10px; background:#fbfbfc; border:1px solid rgba(16,24,40,0.03) }
.checkout-items{ margin-top:12px; background:#fff; border-radius:10px; padding:12px; border:1px solid rgba(16,24,40,0.03) }
.checkout-item{ display:flex; gap:12px; align-items:center; padding:8px 0; border-bottom:1px dashed rgba(16,24,40,0.03) }
.checkout-item:last-child{ border-bottom:0 }
.checkout-item img{ width:56px; height:56px; object-fit:cover; border-radius:8px }
.summary-card{ margin-top:14px; padding:12px; border-radius:10px; background:#fff; border:1px solid rgba(16,24,40,0.03) }
.summary-row{ display:flex; justify-content:space-between; padding:6px 0; color:var(--muted) }
.summary-total{ display:flex; justify-content:space-between; padding:10px 0; font-weight:800; font-size:18px }
.continue-btn{ display:block; width:100%; padding:16px; background:var(--accent); color:#fff; border-radius:12px; text-align:center; font-weight:800; border:0; box-shadow:0 10px 30px rgba(177,18,38,0.12); margin-top:12px }

@media(min-width:900px){
	.checkout-grid{ grid-template-columns:1fr 420px }
}

@media(max-width:900px){
	.schedule-manager .form-row{ grid-template-columns: 1fr; }
}

/* Flatpickr modal styles (large, centered two-month calendar) */
.fp-modal{ position:fixed; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; z-index:3000 }
.fp-modal-backdrop{ position:absolute; left:0; top:0; right:0; bottom:0; background:linear-gradient(90deg,#2b87ff88,#2b87ff88); opacity:0.95 }
.fp-modal-panel{ position:relative; z-index:3010; width:min(1100px,95%); background:#fff; border-radius:12px; box-shadow:0 30px 80px rgba(11,56,145,0.28); padding:18px; display:flex; flex-direction:column }
.fp-modal-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:8px }
.fp-modal-title{ font-weight:700; color:var(--text); font-size:18px }
.fp-modal .flatpickr-calendar{ box-shadow:none; border:0; }
.fp-modal .flatpickr-months{ gap:18px }
.fp-modal .flatpickr-month{ background:transparent }
.fp-modal .flatpickr-day.selected, .fp-modal .flatpickr-day.selected.inRange{ background:#2b87ff; color:#fff; box-shadow:none }
.fp-modal .flatpickr-day.today{ border-color:transparent }
.fp-modal .flatpickr-weekdays{ color:rgba(0,0,0,0.45) }
.fp-modal .flatpickr-weekday{ color:rgba(0,0,0,0.45) }
.fp-modal .flatpickr-day.disabled{ opacity:0.35 }
.fp-modal .flatpickr-wrapper{ padding:6px }
.fp-modal .flatpickr-months .flatpickr-prev-month, .fp-modal .flatpickr-months .flatpickr-next-month{ background:#fff; border-radius:999px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 20px rgba(11,56,145,0.08); color:#2b87ff }
.fp-modal-actions{ display:flex; gap:12px; justify-content:flex-end; padding-top:12px }
.fp-modal .btn{ padding:10px 14px }
.fp-modal .btn.secondary{ background:#fff; border:1px solid rgba(16,24,40,0.06) }

@media(max-width:700px){
	.fp-modal-panel{ width:98%; padding:12px }
	.fp-modal .flatpickr-calendar{ transform:scale(0.92); transform-origin:center top }
}