/* Rasoo.in V58 — full-width, mobile-first, all-device responsive layer.
   Loaded last so it safely corrects legacy fixed grids without changing business logic. */
:root{--v58-gutter:clamp(12px,3vw,48px);--v58-small-gutter:clamp(10px,3vw,20px)}
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;min-width:0;overflow-x:hidden;margin:0}
body>header,body>main,body>footer{width:100%;max-width:100%}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
input,select,textarea,button{min-width:0;max-width:100%;font:inherit}
input,select,textarea{width:100%}
textarea{resize:vertical}
button,.button,.btn,[type="submit"]{touch-action:manipulation}
main,section,article,aside,form,fieldset,div{min-width:0}
p,h1,h2,h3,h4,h5,h6,label,small,strong,span,td,th,code{overflow-wrap:anywhere}

/* Shared page widths */
.section-wrap,.container,.page-wrap,.legal-shell,.portal-shell,.customer-shell,.rider-shell,.dashboard-shell{
  width:min(100% - (2 * var(--v58-gutter)),1280px)!important;
  max-width:1280px!important;
  margin-inline:auto!important;
}

/* Shared header: always uses the complete viewport width */
.site-header,.topbar,.app-header,.admin-header,.rider-header{
  width:100%!important;max-width:none!important;min-width:0!important;
}
.site-header{
  padding-inline:var(--v58-gutter)!important;
}
.site-header .brand,.topbar .brand,.app-header .brand{min-width:0}
.site-header .brand span,.topbar .brand span,.app-header .brand span{min-width:0}
.site-header .brand strong,.site-header .brand small{overflow:hidden;text-overflow:ellipsis}
.site-header .button,.site-header button{flex:0 0 auto}

/* Never let cards or grids create horizontal page scrolling */
.grid,.menu-grid,.tiffin-plan-grid,.steps-grid,.stats-grid,.stat-grid,.admin-grid,.settings-grid,
.portal-main-grid,.subscription-grid,.orders-grid,.two-col,.two-column,.three-col,.form-grid,.field-grid{
  min-width:0!important;max-width:100%!important;
}
.card,.panel,.section-card,.menu-card,.tiffin-card,.stat-card,.modal-card,.auth-card,.admin-card{
  min-width:0!important;max-width:100%!important;
}

/* Tables scroll inside their own card, never the whole page */
.admin-table,.table-wrap,.responsive-table,.admin-table-wrap{
  display:block!important;width:100%!important;max-width:100%!important;
  overflow-x:auto!important;overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;
}
.admin-table table,.table-wrap table,.responsive-table table,.admin-table-wrap table{
  width:100%!important;max-width:none!important;display:table!important;white-space:normal!important;
}
.admin-table table{min-width:720px!important}
.table-wrap .table{min-width:760px}

/* ================= ADMIN ================= */
.admin-shell{
  width:100%!important;max-width:none!important;
  margin:0!important;padding:clamp(22px,3vw,44px) var(--v58-gutter) 56px!important;
}
#loginView,#dashboardView{width:100%;max-width:100%;min-width:0}
.admin-login{width:min(100%,460px)!important;margin:clamp(28px,7vh,80px) auto!important}
.admin-top{width:100%;max-width:100%}
.admin-top>div{min-width:0}
.admin-top h1{font-size:clamp(2rem,4vw,3.15rem)!important;line-height:1.02!important}
.admin-grid{
  width:100%!important;max-width:none!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:start!important;
}
.admin-card{width:100%!important;overflow:hidden!important}
.admin-wide{grid-column:1/-1!important}
.admin-subtitle{min-width:0;flex-wrap:wrap}
.admin-subtitle h2{font-size:clamp(1.35rem,2.3vw,1.85rem)!important}
.admin-subtitle span{max-width:100%;text-align:right}

/* Replace legacy 9-column admin forms with usable fluid grids */
.admin-plan-form,.admin-schedule-form,.admin-schedule-form.weekly,.credit-grant-form-v12,
.password-reset-admin-form-v53,.site-settings-form-v50,.gateway-settings-form-v41{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;align-items:end!important;width:100%!important;max-width:100%!important;
}
.admin-plan-form>label,.admin-schedule-form>label{min-width:0!important;width:100%!important}
.admin-plan-form input,.admin-plan-form select,.admin-plan-form textarea,
.admin-schedule-form input,.admin-schedule-form select,.admin-schedule-form textarea{
  width:100%!important;min-width:0!important;max-width:100%!important;
}
.site-settings-form-v50{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.site-settings-form-v50 .admin-form-wide{grid-column:1/-1!important}
.gateway-settings-form-v41{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.gateway-enable-v41{min-width:0!important;align-self:end!important}
.gateway-enable-v41 input{width:auto!important;flex:0 0 auto}
.password-reset-admin-form-v53{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.admin-plan-form>.button,.admin-schedule-form>.button{width:100%;min-height:46px}
.gateway-security-note-v41 code{display:block;max-width:100%;overflow-wrap:anywhere;word-break:break-word}

/* ================= PUBLIC HOME / MENU ================= */
.z-hero,.hero,.hero-slider,.menu-section{max-width:100%!important;overflow:hidden!important}
.z-hero-content,.hero-content,.z-search-shell,.hero-search,.search-box{min-width:0!important;max-width:100%!important}
.filter-row{display:flex!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.filter-row::-webkit-scrollbar{display:none}
.filter-row>*{flex:0 0 auto}
.menu-card img,.menu-image img,.menu-card-image img{max-width:100%}

/* ================= LOGIN / CUSTOMER ================= */
.portal-login-shell,.login-shell,.auth-layout,.auth-wrap{min-width:0!important;max-width:100%!important}
.auth-wrap{width:min(100% - (2 * var(--v58-gutter)),1020px)!important;margin-inline:auto!important}
.portal-brand-card,.portal-login-card,.auth-card{min-width:0!important}
.portal-dashboard-nav,.section-tabs{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
.portal-tiffin-layout,.portal-dashboard-hero{min-width:0!important;max-width:100%!important}
.topbar{padding-inline:var(--v58-gutter)!important}
.notice-card,.portal-section,.section-tabs{width:min(100% - (2 * var(--v58-gutter)),1170px)!important;max-width:1170px!important;margin-inline:auto!important}
.otp-inline{min-width:0;flex-wrap:wrap}
.otp-inline input{width:min(100%,180px)!important}

/* ================= RIDER / DELIVERY ================= */
.shell{width:min(100% - (2 * var(--v58-gutter)),1280px)!important;max-width:1280px!important;margin-inline:auto!important;padding-inline:0!important}
.login{min-width:0;max-width:100%}
.toolbar,.rider-form{min-width:0;max-width:100%}
.stats,.summary{min-width:0;max-width:100%}
.rider-grid,.ticket-grid{grid-template-columns:repeat(auto-fit,minmax(min(235px,100%),1fr))!important}
dialog{max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;overflow:auto!important}

/* ================= BREAKPOINTS ================= */
@media (max-width:1199px){
  .admin-grid{grid-template-columns:1fr!important}
  .admin-wide{grid-column:auto!important}
  .admin-plan-form,.admin-schedule-form,.admin-schedule-form.weekly,.credit-grant-form-v12,
  .password-reset-admin-form-v53,.site-settings-form-v50,.gateway-settings-form-v41{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .site-settings-form-v50 .admin-form-wide{grid-column:1/-1!important}
}

@media (max-width:820px){
  :root{--v58-gutter:var(--v58-small-gutter)}
  .site-header{min-height:64px!important;gap:10px!important}
  .site-header .brand small{display:none!important}
  .site-header .brand-logo,.site-header .brand img{width:42px!important;height:42px!important;object-fit:contain!important}
  .site-header .button.secondary{padding:.65rem .8rem!important;font-size:.8rem!important}
  .admin-shell{padding-top:22px!important}
  .admin-top{align-items:flex-start!important;flex-direction:column!important}
  .admin-top .button{width:100%!important;justify-content:center!important}
  .auth-wrap,.login{grid-template-columns:1fr!important}
  .auth-hero{padding:8px!important}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .toolbar .search{min-width:100%!important;width:100%!important;margin-left:0!important}
  .rider-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:680px){
  body{font-size:15px}
  h1{font-size:clamp(1.85rem,9vw,2.8rem)!important;line-height:1.06!important}
  h2{font-size:clamp(1.35rem,7vw,2rem)!important;line-height:1.1!important}
  .site-header{padding-block:8px!important}
  .site-header .brand strong{font-size:.95rem!important;max-width:145px!important}
  .admin-shell{padding:18px var(--v58-small-gutter) 40px!important}
  .admin-card{padding:16px!important;border-radius:14px!important}
  .admin-login{padding:18px!important;border-radius:16px!important;margin:24px auto!important}
  .admin-plan-form,.admin-schedule-form,.admin-schedule-form.weekly,.credit-grant-form-v12,
  .password-reset-admin-form-v53,.site-settings-form-v50,.gateway-settings-form-v41{
    grid-template-columns:1fr!important;gap:12px!important;
  }
  .site-settings-form-v50 .admin-form-wide{grid-column:auto!important}
  .admin-subtitle{align-items:flex-start!important;flex-direction:column!important}
  .admin-subtitle span{text-align:left!important}
  .admin-table table{min-width:650px!important}
  .button,.btn,button,[type="submit"]{min-height:44px}
  .auth-wrap{padding:26px 0!important}
  .auth-hero h1{font-size:clamp(2rem,11vw,2.7rem)!important}
  .portal-login-card{padding:20px 14px!important;min-height:100dvh!important}
  .portal-brand-card{display:none!important}
  .notice-card{padding:14px!important}
  .topbar{height:auto!important;min-height:64px!important;padding-block:8px!important;flex-wrap:wrap!important}
  .topbar-actions{max-width:100%;overflow-x:auto}
  .brand small{display:none!important}
  .stat-grid,.stats{grid-template-columns:1fr!important}
  .summary{grid-template-columns:1fr!important}
  .two-col,.two-column,.three-col,.form-grid,.field-grid{grid-template-columns:1fr!important}
  .wide{grid-column:auto!important}
  .task-card{grid-template-columns:1fr!important}
  .feed-item,.subscription-card .row,.head,.card-head{align-items:flex-start!important;flex-direction:column!important}
  .feed-item time{white-space:normal!important}
  .rider-form{grid-template-columns:1fr!important}
  .login>div{padding:4px!important}
  .toolbar,.panel,.card{padding:14px!important;border-radius:14px!important}
  .actions,.task-actions,.contact-actions,.dashboard-hero-actions{width:100%;display:grid!important;grid-template-columns:1fr!important}
  .actions button,.task-actions button,.contact-actions .button,.dashboard-hero-actions .button{width:100%!important}
  .modal-card{width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;padding:16px!important}
  .cart-panel{width:100vw!important;max-width:100vw!important}
}

@media (max-width:380px){
  :root{--v58-small-gutter:9px}
  .site-header .brand strong{max-width:118px!important;font-size:.88rem!important}
  .site-header .button.secondary{padding:.58rem .65rem!important;font-size:.74rem!important}
  .admin-card{padding:13px!important}
  .admin-note{font-size:.82rem!important}
  .summary article,.stats article{padding:12px!important}
}

@media (orientation:landscape) and (max-height:520px){
  .admin-login{margin:12px auto!important}
  .modal-card,dialog{max-height:calc(100dvh - 8px)!important}
}

/* Legal/content pages can contain wide policy tables. Keep every column accessible by
   scrolling the table itself instead of clipping the page. */
.legal-shell table,.legal-page table,.policy-page table{
  display:block!important;width:100%!important;max-width:100%!important;
  overflow-x:auto!important;overflow-y:hidden!important;white-space:normal!important;
  -webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;
}
.legal-shell table tbody,.legal-shell table thead,.legal-shell table tr{
  width:max-content;min-width:100%;
}