/* Shared responsive safety layer. Loaded last by frontend, seller and admin layouts. */
html{max-width:100%;overflow-x:hidden}body{max-width:100%;overflow-x:hidden}img,svg,video,canvas{max-width:100%}input,select,textarea,button{max-width:100%}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}table{max-width:100%}dialog{max-width:calc(100vw - 24px)}
.hero .hero-intro-copy>p{max-width:610px;margin:17px 0 25px;color:#5d6c82;font-size:14px;line-height:1.65}
.hero .hero-search{position:relative}.search-suggestions{position:absolute;z-index:50;top:calc(100% + 8px);left:0;width:min(520px,100%);overflow:hidden;padding:6px;background:#fff;border:1px solid #dce5f0;border-radius:12px;box-shadow:0 18px 42px #17345d26}.search-suggestions[hidden]{display:none}.search-suggestions button{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;width:100%!important;min-height:48px!important;margin:0!important;padding:7px 9px!important;color:#27354a!important;background:#fff!important;border:0!important;border-radius:8px!important;text-align:left!important}.search-suggestions button:hover,.search-suggestions button:focus{background:#f1f6ff!important;outline:0}.suggestion-icon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;color:#155bd7;background:#eaf2ff;border-radius:8px}.search-suggestions b,.search-suggestions small{display:block}.search-suggestions b{font-size:10px}.search-suggestions small{margin-top:2px;color:#7b8798;font-size:8px}

@media(max-width:767px){
  body{font-size:14px}
  .container,.container-fluid{max-width:100%;padding-left:14px!important;padding-right:14px!important}
  input,select,textarea{font-size:16px!important}
  button,.btn,a.button{min-height:40px}
  .modal-dialog{margin:12px}.modal-content{max-height:calc(100dvh - 24px);overflow:auto}
  .modal-footer{gap:8px}.modal-footer>*{margin:0}
  .row{--bs-gutter-x:16px}
}

/* Public website */
@media(max-width:600px){
  body>main{min-width:0}
  header .nav{min-width:0;padding:0}
  header .brand{font-size:21px;min-width:0}
  header .brand img{max-width:118px;height:auto}
  header .searchbar,header .add,header .user-dashboard-link,header .seller-profile-trigger>b{display:none}
  header .user-header-actions{margin-left:auto;gap:5px}
  header .account,header .seller-profile-trigger{width:40px;height:40px;padding:0;justify-content:center}
  header .seller-profile-trigger>span{width:32px;height:32px}
  .user-menu-dropdown,.seller-menu-dropdown{position:fixed;top:62px;left:12px;right:12px;width:auto;max-width:none}
  .hero{overflow:visible}
  .hero-main{height:auto!important;min-height:0;padding-top:38px!important;padding-bottom:26px!important;display:block!important}
  .hero-copy{width:100%!important}
  .hero h1{font-size:32px!important;line-height:1.12!important}
  .hero p{font-size:14px!important;margin-bottom:20px!important}
  .hero-search{width:100%!important;height:auto!important;padding:10px!important;display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
  .hero-search>label,.hero-search>div{width:100%!important;min-height:52px;border:1px solid #e0e6ef!important;border-radius:8px;padding:8px 11px!important}
  .hero-search .search-btn,.hero-search .home-locate{width:100%!important;min-height:46px!important}
  .city,.phone{display:none!important}
  .trend{display:flex;align-items:center;gap:7px;overflow-x:auto;padding-bottom:14px!important;white-space:nowrap;scrollbar-width:none}
  .trend::-webkit-scrollbar{display:none}
  section{max-width:100%}
  .section-head{align-items:flex-start;gap:12px}
  .footer-grid{grid-template-columns:1fr!important;gap:24px!important}
  footer{height:auto!important}
  .copyright{flex-direction:column;align-items:flex-start!important;gap:8px}
  .auth-modal-body{padding:18px}.auth-modal-head{padding:0 17px}
}

/* Home page: phone-first layout */
@media(max-width:600px){
  html,body,body>header,body>main,body>footer{width:100%;min-width:0;margin-left:0;margin-right:0}
  body>header{height:64px!important}
  body>header .container.nav{width:100%;height:64px;padding:0 16px!important;gap:8px;justify-content:flex-start}
  body>header .frontend-brand-logo{max-width:104px;height:38px}
  body>header .brand{margin-right:auto}
  body>header .mobile-menu-toggle{display:none!important}
  body>header .user-header-actions{margin-left:0}
  body>header .user-profile-icon{width:38px;height:38px;justify-content:center}
  body>header .user-profile-icon>span{width:36px;height:36px}
  body>header .seller-header-menu{flex:0 0 auto}
  body>header .seller-profile-trigger{width:40px;height:40px;padding:4px!important;background:#155bd7}
  body>header .seller-profile-trigger>span{width:32px;height:32px}
  body>header .seller-profile-trigger>b,body>header .seller-profile-trigger>svg{display:none!important}
  .hero{width:100%;background:linear-gradient(155deg,#fff 0%,#f3f8ff 100%)}
  .hero .hero-intro-copy{display:none!important}
  .hero .hero-main{width:100%;padding:18px 16px 15px!important}
  .hero-eyebrow{margin-bottom:10px;font-size:8px;letter-spacing:1px}
  .hero .hero-copy h1{max-width:330px;font-size:31px!important;line-height:1.08!important;letter-spacing:-1.5px!important}
  .hero .hero-copy>p{margin:13px 0 18px!important;font-size:12px!important;line-height:1.55!important}
  .hero .hero-search{grid-template-columns:minmax(0,1fr) 46px 46px!important;width:100%!important;padding:8px!important;gap:0!important;border-radius:14px!important;box-shadow:0 12px 30px #173c7214!important}
  .hero .hero-search>label{min-height:58px!important;padding:7px 8px!important;border:0!important;border-bottom:1px solid #e7ecf3!important;border-radius:0!important}
  .hero .hero-search>label:nth-of-type(2){border-bottom:0!important}
  .hero .hero-search .label{font-size:10px!important}
  .hero .hero-search input,.hero .hero-search select{font-size:11px!important;padding-right:4px!important}
  .hero .hero-search .search-btn{grid-column:2!important;width:42px!important;min-width:42px!important;margin:8px 2px 0!important;padding:0!important;min-height:42px!important;height:42px!important;border-radius:10px!important}
  .hero .hero-search .home-locate{grid-column:3!important;width:42px!important;min-width:42px!important;margin:8px 2px 0!important;padding:0!important;min-height:42px!important;height:42px!important;border-radius:10px!important}
  .hero .hero-search .search-btn span,.hero .hero-search .home-locate span{display:none!important}
  .hero .hero-search .search-btn i,.hero .hero-search .home-locate i{font-size:13px!important}
  .hero .search-suggestions{top:calc(100% + 6px);width:100%;max-height:285px;overflow-y:auto}
  .hero-trust{display:grid!important;grid-template-columns:repeat(3,max-content);gap:10px!important;width:100%;margin-top:14px!important;padding-bottom:2px;overflow-x:auto;font-size:8px!important;scrollbar-width:none}
  .hero-trust span:nth-child(3){display:flex!important}
  .hero .trend{width:100%;padding:10px 16px 15px!important;gap:7px!important}
  main>.section{padding:24px 0!important;overflow:hidden}
  main>.section .container{padding:0 16px!important}
  main>.section .section-title{align-items:center;margin-bottom:15px!important}
  main>.section .section-title h2{margin:0;font-size:18px;line-height:1.25}
  main>.section .section-title .view{flex:0 0 auto;font-size:11px}
  main>.section .cats{display:flex!important;gap:11px!important;width:calc(100% + 16px);margin-right:-16px;padding:2px 16px 13px 0!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;scroll-padding-left:0;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  main>.section .cats::-webkit-scrollbar{display:none}
  main>.section .cat{flex:0 0 145px!important;min-width:145px!important;scroll-snap-align:start;scroll-snap-stop:always}
  main>.section .cat-icon{height:92px!important;border-radius:12px!important}
  main>.section .cat p{margin:7px 2px 0!important;font-size:11px!important;white-space:normal!important;line-height:1.3!important}
  main>.section .cards{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%;padding:0!important;overflow:visible!important}
  main>.section .cards>.card{width:100%!important;min-width:0!important;flex:auto!important}
  main>.section .service{height:auto!important;min-height:390px}
  main>.section .service>a:first-child{height:175px!important;flex-basis:175px!important}
  main>.section .nearby{height:auto!important;min-height:245px}
  main>.section .nearby>img{height:145px!important}
  main>.section .emergency{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;padding:0!important;overflow:visible!important}
  .emergency .emergency-card{width:100%!important;min-width:0!important;flex:auto!important}
}
@media(max-width:350px){
  .hero .hero-copy h1{font-size:28px!important}
  main>.section .cat{flex-basis:132px!important;min-width:132px!important}
  main>.section .cat-icon{height:84px!important}
}

/* User dashboard */
@media(max-width:850px){
  .account-dashboard{width:100%;min-width:0;grid-template-columns:1fr;gap:14px;padding:16px 14px 38px}
  .account-sidebar{position:sticky!important;z-index:18;top:66px!important;width:100%;min-width:0;padding:8px!important;border-radius:11px!important;box-shadow:0 7px 20px #17345d14!important}
  .account-sidebar nav{display:flex!important;gap:5px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0!important}
  .account-sidebar nav::-webkit-scrollbar{display:none}
  .account-sidebar nav a{flex:0 0 auto;min-height:38px;padding:9px 11px!important;white-space:nowrap}
  .account-content{width:100%;min-width:0}
  .account-card,.dashboard-module{scroll-margin-top:130px}
}
@media(max-width:600px){
  .account-dashboard{padding:12px 12px 34px!important}
  .account-sidebar{top:65px!important;margin:0!important}
  .account-sidebar nav a{font-size:10px!important}
  .account-sidebar nav a svg{width:14px;height:14px}
  .account-hero{gap:14px;margin:4px 1px 15px!important}
  .account-hero h1{font-size:24px!important;line-height:1.18}
  .account-hero p{font-size:11px;line-height:1.55}
  .account-hero .button{min-height:44px}
  .account-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-bottom:14px!important}
  .account-stats>div{min-width:0;align-items:center;flex-direction:column;gap:7px!important;padding:11px 5px!important;text-align:center}
  .account-stats .stat-icon{flex-basis:34px;width:34px;height:34px}
  .account-stats b{font-size:13px!important;overflow-wrap:anywhere}
  .account-stats small{font-size:8px!important;line-height:1.25}
  .account-card{margin-bottom:12px!important;padding:15px 13px!important}
  .module-head,.section-heading{gap:9px!important}
  .module-head>span,.section-heading>span{flex-basis:34px!important;width:34px!important;height:34px!important}
  .module-head h2,.section-heading h2{font-size:14px!important}
  .module-head p,.section-heading p{font-size:9px!important}
  .module-row{display:grid!important;grid-template-columns:34px minmax(0,1fr);gap:9px!important;padding:13px 0!important}
  .module-row>.row-icon{grid-column:1;grid-row:1/3}
  .module-row>div{grid-column:2;min-width:0}
  .module-row>time,.module-row>.module-status{grid-column:2;margin:5px 0 0!important;justify-self:start}
  .module-row p{white-space:normal;overflow-wrap:anywhere}
  .notification-row time{padding:3px 7px}
  .account-card .grid,.report-form{grid-template-columns:1fr!important;gap:13px!important}
  .profile-actions,.report-actions,.account-card .actions{width:100%;align-items:stretch!important;flex-direction:column!important}
  .profile-actions button,.report-actions button,.account-card .actions button{width:100%}
  .address{display:grid!important;grid-template-columns:34px minmax(0,1fr) auto;gap:9px!important}
  .address>span{grid-column:1}.address>div{grid-column:2}.address>.remove{grid-column:3;margin:0!important}
  .support-actions{grid-template-columns:1fr!important}
  .lost-found-grid,.lost-found-actions,.lost-found-steps{grid-template-columns:1fr!important}
  #modal{width:calc(100% - 16px)!important;max-height:calc(100dvh - 16px)!important;padding:16px 13px!important}
  #modal .modal-heading>div{min-width:0}
  #modal .map-heading{align-items:stretch;flex-direction:column}
  #modal .map-heading button{width:100%}
}
@media(max-width:360px){
  .account-stats{grid-template-columns:1fr!important}
  .account-stats>div{display:grid;grid-template-columns:34px 1fr;text-align:left}
}

/* Seller area */
@media(max-width:800px){
  .dashboard-shell{width:100%;min-width:0;padding:14px!important;gap:14px!important}
  .dashboard-sidebar{width:100%;padding:14px!important;border:1px solid #e3e8f0!important;border-radius:12px;overflow:hidden}
  .dashboard-sidebar nav{display:flex!important;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:3px}
  .dashboard-sidebar nav::-webkit-scrollbar{display:none}
  .dashboard-sidebar nav a{flex:0 0 auto;white-space:nowrap}
  .dashboard-content{min-width:0;width:100%;padding:0!important}
  .seller-main-footer{padding:22px 16px;gap:14px}
}
@media(max-width:560px){
  .seller-app-header{padding:0 12px}
  .seller-header-brand strong{font-size:18px}
  .heading{gap:10px}.heading h1{overflow-wrap:anywhere}
  .heading .status{flex:0 0 auto}
  .stats{grid-template-columns:1fr 1fr!important;gap:9px}
  .stats>div{padding:14px!important}
  article{padding:15px!important;border-radius:11px!important}
  .grid,.upload-grid,.review-summary{grid-template-columns:1fr!important}
  .card-title{align-items:flex-start;gap:10px;flex-direction:column}
  .save-bar{align-items:stretch;flex-direction:column}.save-bar button,.save-bar a{width:100%;text-align:center}
  .seller-main-footer nav{gap:6px 14px}
}

/* Admin area */
@media(max-width:991px){
  .admin-shell,.main-panel{width:100%;min-width:0}
  .dashboard-content{width:100%;min-width:0;padding:16px!important}
  .topbar{padding:0 14px!important}
  .offcanvas.mobile-nav{width:min(290px,88vw)}
}
@media(max-width:767px){
  .dashboard-heading,.management-title{align-items:flex-start!important;gap:12px;flex-direction:column}
  .dashboard-heading>a,.dashboard-heading>button,.management-title>a,.management-title>button{width:100%;justify-content:center}
  .panel,.form-section{min-width:0;padding:14px!important}
  .list-toolbar,.advanced-filters{min-width:0}
  .filter-fields,.create-form-grid{grid-template-columns:1fr!important}
  .filter-controls,.form-actions{display:grid!important;grid-template-columns:1fr!important;width:100%}
  .filter-controls button,.form-actions button,.form-actions a{width:100%;justify-content:center}
  .admin-list-panel .table-responsive{margin:0;max-width:100%;border-radius:9px}
  .admin-list-panel table{min-width:720px}
  .metric-row .col-xl{flex:0 0 100%!important;max-width:100%!important}
  .top-actions{gap:7px!important}.top-actions .icon-button{min-width:38px}
  footer{padding:10px 14px!important;min-height:44px}
}
@media(max-width:420px){
  .dashboard-content{padding:12px!important}
  .topbar .page-title h1{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}