/*
 * صنايعي الحِلّة — Concept UI layer
 * يحافظ على وظائف V10.2 ويعيد بناء اللغة البصرية لتطابق المرجع المفاهيمي.
 */
:root{
  --concept-bg:#f6faf8;
  --concept-card:#ffffff;
  --concept-ink:#102f35;
  --concept-muted:#708388;
  --concept-line:#dfe9e6;
  --concept-green:#087c68;
  --concept-green-dark:#075f52;
  --concept-green-soft:#eaf7f2;
  --concept-mint:#dff3ec;
  --concept-blue:#146fd8;
  --concept-whatsapp:#16a95a;
  --concept-warm:#fff8e8;
  --concept-warm-line:#efd9a8;
  --concept-shadow:0 10px 30px rgba(25,66,57,.08);
  --concept-radius:22px;
}
html{background:var(--concept-bg)}
body.native-app{background:linear-gradient(180deg,#f9fcfb 0,#f4f8f7 100%);color:var(--concept-ink);font-family:Tahoma,"Segoe UI",Arial,sans-serif;padding-bottom:calc(88px + var(--safe-bottom))}
#app-main{max-width:720px}

/* Header */
.appbar{background:rgba(255,255,255,.97);border-bottom:1px solid rgba(219,232,227,.95);box-shadow:0 2px 16px rgba(20,62,54,.035)}
.appbar-inner{height:74px;padding:0 18px;gap:10px}
.app-brand{margin-inline-start:auto;gap:9px}.app-logo-image{width:48px;height:48px;border-radius:16px;box-shadow:0 7px 18px rgba(8,124,104,.16)}
.app-brand-copy b{font-size:1.05rem;color:#14343a}.app-brand-copy small{font-size:.7rem;color:#7d8c90;max-width:155px}
.appbar-actions{margin-inline-end:auto;gap:6px}.icon-button{width:40px;height:40px;border-radius:14px;background:#f2f7f5;color:#214c45}.menu-button{display:grid}.profile-chip{padding:3px 4px}.profile-chip #top-account-label{font-size:.74rem;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-avatar{width:40px;height:40px;border-radius:14px;background:#e6f4ef;color:#087c68}

/* General screen rhythm */
.app-screen{padding:20px 16px 32px}.screen-header{margin-bottom:16px}.screen-header h1{font-size:1.55rem}.screen-header p{font-size:.76rem}.concept-screen-header span{display:block;margin-top:5px;color:var(--concept-muted);font-size:.78rem;line-height:1.6}

/* Home */
.concept-greeting{align-items:flex-end;margin:5px 0 15px}.concept-greeting h1{font-size:1.72rem;letter-spacing:-.015em}.greeting-subline{margin:5px 0 0;color:#75878b;font-size:.79rem}.location-pill{background:#fff;border-color:#dce8e4;padding:9px 12px;color:#315e56;box-shadow:0 3px 10px rgba(16,62,53,.03)}
.concept-quick-actions{gap:11px}.concept-request-hero{min-height:134px!important;border-radius:24px!important;padding:20px 18px!important;background:linear-gradient(135deg,#087c68 0%,#056758 100%)!important;position:relative;overflow:hidden}.concept-request-hero:after{content:"";position:absolute;inset:auto -40px -55px auto;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.065)}.concept-request-hero:before{content:"";position:absolute;inset:-60px auto auto -65px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.045)}
.concept-request-hero .quick-icon{width:56px;height:56px;border-radius:17px;background:rgba(255,255,255,.17);z-index:1}.concept-request-hero .quick-icon svg{width:27px;height:27px}.concept-request-hero b{font-size:1.22rem}.concept-request-hero small{font-size:.82rem;line-height:1.7;max-width:390px}.concept-request-hero>span{z-index:1}.concept-request-hero .quick-chevron{opacity:.75}
.concept-provider-card{min-height:88px;border-radius:20px!important;padding:14px 16px!important}.concept-provider-card .quick-icon{width:50px;height:50px;border-radius:15px}.concept-provider-card b{font-size:1.02rem}.concept-provider-card small{font-size:.78rem;line-height:1.6}
.home-search-launch{width:100%;margin-top:11px;min-height:53px;border:1px solid #d9e6e2;border-radius:17px;background:#fff;color:#708287;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;text-align:right;padding:0 15px;box-shadow:0 4px 15px rgba(16,63,53,.035)}.home-search-launch>svg:first-child{color:#087c68}.home-search-launch>svg:last-child{width:16px;opacity:.5}
.concept-home-services{margin-top:21px}.concept-home-services .mobile-section-head h2{font-size:1.2rem}.concept-home-services .mobile-section-head p{font-size:.74rem}
.home-service-grid{grid-template-columns:repeat(4,1fr);gap:8px}.home-service-tile{min-height:100px!important;border-radius:18px!important;padding:10px 4px!important}.home-service-tile>span{width:45px!important;height:45px!important;border-radius:14px!important}.home-service-tile>span svg{width:24px!important;height:24px!important}.home-service-tile b{font-size:.72rem!important}.home-service-tile small{display:none!important}
.concept-urgent-card{margin-top:18px;min-height:92px;border-radius:20px;padding:16px 17px;background:linear-gradient(135deg,#fff9ec,#fff5df);border-color:#eed7a8;color:#7a5618;box-shadow:none}.concept-urgent-card>svg:first-child{width:42px;height:42px;padding:10px;background:#fff0c7;border-radius:14px}.concept-urgent-card b{font-size:1rem}.concept-urgent-card small{line-height:1.65;font-size:.76rem}
.availability-card,.ad-slot,.home-requests-section{border-radius:19px}.home-requests-section{margin-top:22px}

/* Service catalog and discovery */
.services-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:26px}.catalog-service-tile{min-height:122px!important;border-radius:20px!important;align-items:flex-start!important;padding:16px!important;text-align:right!important;justify-content:flex-start!important;box-shadow:0 5px 18px rgba(20,60,52,.04)}.catalog-service-tile>span{width:52px!important;height:52px!important;border-radius:16px!important}.catalog-service-tile b{font-size:.9rem!important;color:#173c41}.catalog-service-tile small{font-size:.72rem;color:#7b8b8f!important}
.concept-discovery{margin-top:6px!important;padding-top:18px;border-top:1px solid #e4ece9}.discovery-title{align-items:center}.discovery-title h2{font-size:1.35rem}.result-count{background:#edf6f2;border-radius:999px;padding:5px 9px;color:#407268}
.concept-search{padding:13px;border-radius:21px;border-color:#dde8e4;box-shadow:0 8px 24px rgba(17,60,52,.045)}.concept-search .search-box{height:50px;border-radius:15px;background:#fbfdfc}.concept-search .filter-row{grid-template-columns:1fr 1fr;gap:9px}.filter-field{display:flex;flex-direction:column;gap:5px;color:#355a54;font-size:.7rem;font-weight:700}.filter-field span{padding-inline:4px}.filter-field select{height:46px!important;border-radius:13px!important;background:#fff!important;font-size:.8rem!important;padding-inline:10px!important}.search-submit-concept{min-height:45px!important;display:flex;align-items:center;gap:6px}.search-submit-concept svg{width:16px;height:16px}.filter-actions{justify-content:space-between}
.active-filters{padding-top:3px}.filter-chip{background:#e9f5f1;color:#176b5d;padding:6px 10px}

/* Provider cards */
.native-results{gap:12px}.native-provider-card{border-radius:21px;padding:14px;box-shadow:0 7px 22px rgba(19,57,51,.055);border-color:#dfe9e5}.provider-head{align-items:flex-start}.provider-image,.provider-avatar{width:62px;height:62px;border-radius:18px}.provider-title{flex:1}.provider-title h3{font-size:1.03rem;margin-top:2px}.service-mini-tags{margin-top:5px}.service-mini-tag{background:#f1f6f4;color:#4f6e68;border-radius:999px}.provider-card-meta{margin-top:6px}.provider-rating{color:#aa781c}.coverage-match{background:#e8f5ef;color:#167057}.provider-badges{margin-top:10px}.available-badge{background:#dff5e8;color:#17744d}.provider-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:10px 0 8px}.provider-locations{margin:6px 0 4px}.provider-actions{grid-template-columns:1fr 1fr 1fr!important;gap:7px!important;margin-top:13px}.provider-actions>a,.provider-actions>button{min-height:43px!important;border-radius:11px!important;font-size:.76rem!important}.call-button{background:#166fd4!important}.whatsapp-button{background:#16a957!important}.outline-call{background:#fff!important;border:1px solid #b8d0dc!important;color:#25637a!important}.wa-mark{font-size:.52rem!important;width:19px!important;height:19px!important}

/* Requests */
#requests-screen .screen-header{align-items:center}.request-tabs{background:#eef4f2;border-radius:13px;padding:3px;gap:3px}.request-tabs button{flex:1;border:0;border-radius:10px}.request-tabs button.active{background:#fff;color:#087c68;box-shadow:0 3px 10px rgba(18,58,51,.08)}.request-card{border-radius:18px;padding:14px 15px;box-shadow:0 5px 18px rgba(20,57,52,.045)}.request-status{padding:4px 9px}.compact-request-list .request-card{border-radius:17px}.request-actions-menu summary{border-radius:10px}

/* Account */
#account-screen .screen-header{margin-bottom:12px}.account-card{border-radius:20px!important;border-color:#dfe8e5!important;box-shadow:0 6px 20px rgba(20,60,53,.045)}.profile-summary{padding:15px!important}.profile-summary .profile-avatar.large{width:56px;height:56px;border-radius:18px}.profile-summary h2{font-size:1.05rem}.account-menu{border-radius:20px}.account-menu button,.account-menu a{min-height:62px;padding:12px 15px}.account-menu b{font-size:.88rem}.account-menu small{font-size:.7rem}.account-menu>*>svg{width:21px;height:21px;color:#426861}.account-menu .danger-row{color:#c03d35}

/* Dialogs: mobile app sheet feel */
.work-dialog{border-radius:26px!important;padding:19px!important}.work-dialog h2{font-size:1.25rem!important}.data-form input,.data-form select,.data-form textarea{border:1px solid #d9e5e1!important;background:#fbfdfc!important;border-radius:13px!important}.data-form .solid{min-height:49px;border-radius:13px!important}.concept-service-browser section{background:#f9fcfb!important;border-radius:18px!important}.concept-service-browser .service-browser-grid button{border-radius:13px!important;min-height:52px!important}
.provider-profile-dialog{gap:14px}.profile-dialog-head{background:linear-gradient(180deg,#f2f9f6,#fff);border-radius:18px;padding:13px}.profile-dialog-head img,.provider-avatar.large{border-radius:20px}.provider-profile-dialog h3{margin:5px 0 0}.coverage-list{background:#f8fbfa;border-radius:14px;padding:11px 28px 11px 11px}

/* Bottom navigation — five-item concept layout */
.concept-bottom-nav{height:calc(77px + var(--safe-bottom));grid-template-columns:repeat(5,1fr);padding:5px max(5px,calc((100vw - 720px)/2 + 5px)) var(--safe-bottom);box-shadow:0 -6px 24px rgba(17,55,48,.06);border-top-color:#dde8e4}.concept-bottom-nav button{color:#738782;gap:3px}.concept-bottom-nav button>span{height:28px}.concept-bottom-nav button.is-active{color:#087c68}.concept-bottom-nav button.is-active>span{width:42px;background:#e7f5ef}.concept-bottom-nav .request-nav-button>span{width:52px!important;height:52px!important;margin-top:-24px;border-radius:50%!important;background:linear-gradient(145deg,#0a8a72,#08715f)!important;color:#fff!important;box-shadow:0 8px 20px rgba(8,124,104,.28);border:4px solid #fff}.concept-bottom-nav .request-nav-button svg{width:24px;height:24px}.concept-bottom-nav .request-nav-button b{margin-top:-3px;color:#315c54;font-weight:700}.concept-bottom-nav b{font-size:.63rem}.concept-bottom-nav i{top:5px;inset-inline-end:calc(50% - 22px)}

/* Empty states / platform note */
.empty-state{border-radius:20px!important;background:#fff!important}.platform-note{background:#f6f9f8;border-radius:12px;padding:9px 11px;color:#778986!important}

/* Tablet / desktop */
@media(min-width:640px){
  .concept-quick-actions{grid-template-columns:1.35fr .85fr}.concept-request-hero{min-height:150px!important}.home-service-grid{grid-template-columns:repeat(4,1fr)}.services-catalog-grid{grid-template-columns:repeat(3,1fr)}.concept-search .filter-row{grid-template-columns:repeat(4,1fr)}.native-results{grid-template-columns:1fr 1fr}.provider-actions{grid-template-columns:1fr 1fr 1fr!important}
}
@media(max-width:520px){
  .appbar-inner{height:68px;padding-inline:12px}.app-logo-image{width:44px;height:44px}.app-brand-copy small{max-width:120px}.menu-button{display:none}.app-screen{padding:16px 12px 30px}.concept-greeting{align-items:flex-start}.concept-greeting h1{font-size:1.55rem}.greeting-subline{font-size:.73rem}.location-pill{padding:7px 9px;font-size:.72rem}.concept-request-hero{min-height:124px!important}.concept-request-hero .quick-icon{width:50px;height:50px}.concept-request-hero b{font-size:1.12rem}.concept-request-hero small{font-size:.76rem}.home-service-grid{gap:7px}.home-service-tile{min-height:91px!important}.home-service-tile>span{width:40px!important;height:40px!important}.services-catalog-grid{gap:8px}.catalog-service-tile{min-height:111px!important;padding:13px!important}.concept-search .filter-row{grid-template-columns:1fr 1fr}.provider-actions{grid-template-columns:1fr 1fr!important}.provider-actions .outline-call{grid-column:1/-1}.concept-bottom-nav{height:calc(73px + var(--safe-bottom))}.concept-bottom-nav .request-nav-button>span{width:49px!important;height:49px!important;margin-top:-21px}.concept-bottom-nav b{font-size:.6rem}
}
@media(max-width:380px){
  .app-brand-copy b{font-size:.94rem}.profile-chip #top-account-label{display:none}.home-service-grid{grid-template-columns:repeat(2,1fr)}.home-service-tile small{display:block!important;font-size:.62rem!important}.services-catalog-grid{grid-template-columns:1fr 1fr}.catalog-service-tile{padding:11px!important}.catalog-service-tile>span{width:45px!important;height:45px!important}.concept-search .filter-row{grid-template-columns:1fr}.provider-actions{grid-template-columns:1fr!important}.provider-actions .outline-call{grid-column:auto}.concept-bottom-nav b{font-size:.56rem}
}
