/* Z BILISIM V7.4.0 — FINAL PROFESSIONAL DARK UI */
:root{
 --zbg:#07090d;--zbg2:#0b0e13;--zsurface:#11151b;--zsurface2:#171c23;--zsurface3:#1c222b;
 --zline:#252d38;--zline2:#1d242d;--ztext:#f6f8fb;--zmuted:#8993a1;
 --zgreen:#22d67f;--zgreen2:#16b86c;--zblue:#4c91ff;--zorange:#f6a936;--zred:#ff4b5a;--zpurple:#a985ff;
 --zradius:18px;--zradius2:14px;
}
html{background:var(--zbg)!important;color-scheme:dark!important}
html body{background:var(--zbg)!important;color:var(--ztext)!important}
html body.v5-body .app-shell,html body.v5-body .main-area,html body.v5-body .v5-main{background:var(--zbg)!important;color:var(--ztext)!important}
html body a{text-decoration:none!important}

/* GLOBAL FORM RESET — old app.css/pro.css white rules cannot win */
html body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html body select,html body textarea,
html body .form-control,html body .input,html body .select,
html body [contenteditable="true"]{
 background:#12171e!important;color:var(--ztext)!important;border:1px solid #2b3440!important;
 border-radius:13px!important;box-shadow:none!important;outline:none!important;
}
html body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
html body select:focus,html body textarea:focus{
 background:#141a21!important;border-color:var(--zgreen)!important;box-shadow:0 0 0 3px rgba(34,214,127,.12)!important;
}
html body input::placeholder,html body textarea::placeholder{color:#717b88!important;opacity:1!important}
html body option{background:#12171e!important;color:#fff!important}
html body input[disabled],html body select[disabled],html body textarea[disabled]{background:#0d1116!important;color:#707985!important;opacity:.85!important}
html body input[type=file]{background:#11161c!important;color:#dce3ea!important;border:1px dashed #303a46!important;border-radius:13px!important;padding:10px!important}

/* form/card containers — catch legacy one-off forms */
html body.v5-body form:not(.ops-board-search):not(.unified-searchbar),
html body.v5-body .form-grid,html body.v5-body .field-form-grid,
html body.v5-body .modal,html body.v5-body dialog,
html body.v5-body .modal-card,html body.v5-body .modal-body,html body.v5-body .modal-content,
html body.v5-body .comm-dialog,html body.v5-body .mobile-create-sheet>section,
html body.v5-body .v5-intake-card,html body.v5-body .v5-quick-customer,
html body.v5-body .v5-new-device,html body.v5-body .selected-customer,
html body.v5-body .device-history,html body.v5-body .device-mode-bar,
html body.v5-body .service-tab-panel,html body.v5-body .service-form-card,
html body.v5-body .field-edit-form,html body.v5-body .field-promise-form,
html body.v5-body .reminder-card,html body.v5-body .promise-entry,
html body.v5-body .service-item-row,html body.v5-body .field-item-list article,
html body.v5-body .service-collection-buckets>div,html body.v5-body .service-collection-items>div{
 background:linear-gradient(180deg,var(--zsurface) 0%,#0e1319 100%)!important;
 color:var(--ztext)!important;border-color:var(--zline)!important;box-shadow:none!important;
}
/* keep structurally transparent forms transparent where needed */
html body.v5-body .ops-board-search,html body.v5-body .unified-searchbar,
html body.v5-body form.v5-intake,html body.v5-body form#fieldEdit{background:transparent!important;border:0!important;box-shadow:none!important}

/* all major surfaces */
html body.v5-body .panel,html body.v5-body .unified-panel,html body.v5-body .pro-card,
html body.v5-body .profile-card,html body.v5-body .service-card,html body.v5-body .device-card,
html body.v5-body .customer-card-pro,html body.v5-body .field-job-card,
html body.v5-body .company-directory-card,html body.v5-body .account-party-card,
html body.v5-body .collection-customer,html body.v5-body .maintenance-card,
html body.v5-body .quick-card,html body.v5-body .activity-card,html body.v5-body .status-summary,
html body.v5-body .ops-live-panel,html body.v5-body .v5-reminder-card,html body.v5-body .v5-attention-card,
html body.v5-body .lookup-card,html body.v5-body .login-card{
 background:linear-gradient(180deg,var(--zsurface) 0%,#0f141a 100%)!important;
 color:var(--ztext)!important;border:1px solid var(--zline)!important;box-shadow:none!important;
}
html body.v5-body h1,html body.v5-body h2,html body.v5-body h3,html body.v5-body h4,
html body.v5-body b,html body.v5-body strong{color:var(--ztext)!important}
html body.v5-body p,html body.v5-body small,html body.v5-body .muted,html body.v5-body .hint{color:var(--zmuted)!important}
html body.v5-body label,html body.v5-body label span{color:#dbe2ea!important}

/* page bars, filters, lists */
html body.v5-body .topbar,html body.v5-body .v5-desk-head,html body.v5-body .corp-page-head,
html body.v5-body .field-dashboard-head{border-color:var(--zline2)!important}
html body.v5-body .filters,html body.v5-body .service-pro-filter,html body.v5-body .customer-searchbar,
html body.v5-body .device-pro-filter,html body.v5-body .history-filter,html body.v5-body .warranty-filter,
html body.v5-body .corp-search,html body.v5-body .field-filter,html body.v5-body .collection-filter,
html body.v5-body .ops-board-toolbar{
 background:#0e1319!important;border:1px solid var(--zline)!important;box-shadow:none!important;
}
html body.v5-body .service-row,html body.v5-body .ops-board-row,html body.v5-body .ops-live-list>a,
html body.v5-body .account-mini-list>a,html body.v5-body .collection-job-list>a,
html body.v5-body .v60-activity-list article,html body.v5-body .promise-mini-list article{
 background:#10151b!important;color:var(--ztext)!important;border-color:var(--zline2)!important;
}
html body.v5-body .service-row:hover,html body.v5-body .ops-board-row:hover,html body.v5-body .ops-live-list>a:hover,
html body.v5-body .account-mini-list>a:hover,html body.v5-body .collection-job-list>a:hover{background:#151b22!important}
html body.v5-body .service-row-head,html body.v5-body .ops-board-head{background:#0d1116!important;color:#7f8995!important;border-color:var(--zline2)!important}
html body.v5-body table{background:#0f141a!important;color:var(--ztext)!important;border-color:var(--zline)!important}
html body.v5-body th{background:#12171e!important;color:#8e98a5!important;border-color:var(--zline)!important}
html body.v5-body td{background:#10151b!important;color:#dfe5ec!important;border-color:var(--zline2)!important}
html body.v5-body tr:hover td{background:#151b22!important}

/* buttons */
html body.v5-body .btn,html body.v5-body button,html body.v5-body .v5-primary,html body.v5-body .v5-secondary{box-shadow:none!important}
html body.v5-body .btn-dark,html body.v5-body .btn-primary,html body.v5-body .btn-primary-pro,
html body.v5-body .v5-primary,html body.v5-body .primary-quick{
 background:linear-gradient(135deg,var(--zgreen),var(--zgreen2))!important;color:#07120c!important;border-color:var(--zgreen)!important;
}
html body.v5-body .btn-light,html body.v5-body .v5-secondary,html body.v5-body .open-btn,
html body.v5-body .mini-action,html body.v5-body .v5-text-action{
 background:#171d25!important;color:#f2f5f8!important;border:1px solid #29323d!important;
}
html body.v5-body .btn-danger{background:rgba(255,75,90,.14)!important;color:#ff9aa3!important;border-color:rgba(255,75,90,.26)!important}

/* vivid status language */
html body.v5-body .badge.new{background:#1a2028!important;color:#b7c0ca!important}
html body.v5-body .badge.diagnosis,html body.v5-body .badge.repair{background:rgba(76,145,255,.15)!important;color:#94bcff!important}
html body.v5-body .badge.approval{background:rgba(246,169,54,.15)!important;color:#ffd18b!important}
html body.v5-body .badge.waiting{background:rgba(255,126,43,.15)!important;color:#ffb17c!important}
html body.v5-body .badge.ready,html body.v5-body .badge.delivered{background:rgba(34,214,127,.15)!important;color:#89efbb!important}
html body.v5-body .badge.cancelled{background:rgba(255,75,90,.14)!important;color:#ff9aa3!important}

/* ==== DESKTOP SIDEBAR: full-width, dense, no auto-collapse ==== */
html body.v5-body .v5-shell{grid-template-columns:276px minmax(0,1fr)!important}
html body.v5-body .v5-sidebar{
 width:276px!important;min-width:276px!important;height:100vh!important;position:sticky!important;top:0!important;
 padding:10px 10px 12px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;
 gap:6px!important;background:#080b10!important;border-right:1px solid #1b222b!important;overflow-y:auto!important;scrollbar-width:thin!important;
}
html body.v5-body .v5-sidebar .brand{
 width:100%!important;height:66px!important;min-height:66px!important;margin:0!important;padding:8px 12px!important;
 background:#11161c!important;border:1px solid #202833!important;border-radius:18px!important;box-shadow:none!important;
}
html body.v5-body .v5-sidebar .brand-logo{max-width:170px!important;max-height:48px!important;margin:auto!important}
html body.v5-body .v5-nav{display:flex!important;flex-direction:column!important;gap:5px!important;width:100%!important}
html body.v5-body .v5-nav-group{
 display:grid!important;gap:0!important;padding:5px 7px!important;margin:0!important;
 background:#11151a!important;border:1px solid #1e252f!important;border-radius:17px!important;
}
html body.v5-body .v5-nav-label{
 display:block!important;padding:3px 8px 5px!important;margin:0!important;color:#687381!important;
 font-size:8px!important;line-height:1!important;font-weight:900!important;letter-spacing:.13em!important;
}
html body.v5-body .v5-nav a{
 position:relative!important;display:grid!important;grid-template-columns:30px minmax(0,1fr) 13px!important;align-items:center!important;
 gap:9px!important;width:100%!important;min-height:39px!important;padding:4px 8px!important;margin:0!important;
 color:#e5eaf0!important;background:transparent!important;border:0!important;border-radius:11px!important;
}
html body.v5-body .v5-nav a:not(:last-child):after{
 content:"";position:absolute!important;left:45px!important;right:7px!important;bottom:0!important;height:1px!important;background:#1b222b!important;
}
html body.v5-body .v5-nav-icon{
 width:30px!important;height:30px!important;border-radius:9px!important;display:grid!important;place-items:center!important;
 background:#171d24!important;border:1px solid #232c36!important;color:#e7ecf2!important;
}
html body.v5-body .v5-nav-icon svg{width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
html body.v5-body .v5-nav a b{font-size:11px!important;line-height:1.1!important;font-weight:760!important;color:inherit!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body.v5-body .v5-nav-arrow{font-size:18px!important;font-style:normal!important;line-height:1!important;color:#687381!important;text-align:right!important}
html body.v5-body .v5-nav a:hover{background:#171d24!important;color:#fff!important}
html body.v5-body .v5-nav a.active{background:rgba(34,214,127,.13)!important;color:#f7fffb!important;box-shadow:inset 3px 0 0 var(--zgreen)!important}
html body.v5-body .v5-nav a.active .v5-nav-icon{background:rgba(34,214,127,.16)!important;border-color:rgba(34,214,127,.23)!important;color:#89efbb!important}
html body.v5-body .v5-nav a.active .v5-nav-arrow{color:#89efbb!important}
html body.v5-body .v5-nav a em{position:absolute!important;right:24px!important;top:50%!important;transform:translateY(-50%)!important;min-width:19px!important;height:19px!important;background:var(--zred)!important;color:#fff!important;border:2px solid #11151a!important;border-radius:999px!important;font-size:8px!important;font-style:normal!important;display:grid!important;place-items:center!important}

/* user/logout now normal-flow, NOT pinned at bottom */
html body.v5-body .v5-user-mini{
 margin:0!important;margin-top:1px!important;padding:6px 7px!important;display:grid!important;grid-template-columns:30px minmax(0,1fr) auto!important;
 gap:8px!important;align-items:center!important;background:#11151a!important;border:1px solid #1e252f!important;border-radius:15px!important;
}
html body.v5-body .v5-user-avatar{width:30px!important;height:30px!important;border-radius:9px!important;background:var(--zgreen)!important;color:#07120c!important;display:grid!important;place-items:center!important;font-size:10px!important;font-weight:900!important}
html body.v5-body .v5-user-copy{min-width:0!important}.v5-user-copy span{display:block!important;color:#fff!important;font-size:10px!important;font-weight:800!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.v5-user-copy small{display:block!important;color:#7f8995!important;font-size:8px!important;margin-top:1px!important}
html body.v5-body .v5-logout-link{width:auto!important;height:30px!important;padding:0 8px!important;display:flex!important;align-items:center!important;gap:5px!important;background:#171d24!important;border:1px solid #242d38!important;border-radius:9px!important;color:#cfd6df!important;font-size:8px!important;font-weight:800!important}
html body.v5-body .v5-logout-link svg{width:14px!important;height:14px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}.v5-logout-link span{display:inline!important}

/* prevent pro.css tablet mini-sidebar: only mobile becomes drawer */
@media (min-width:761px){
 html body.v5-body .v5-shell{grid-template-columns:276px minmax(0,1fr)!important}
 html body.v5-body .v5-sidebar{width:276px!important;min-width:276px!important;align-items:stretch!important}
 html body.v5-body .v5-nav-label{display:block!important}
 html body.v5-body .v5-nav a{grid-template-columns:30px minmax(0,1fr) 13px!important;justify-items:stretch!important;min-height:39px!important;padding:4px 8px!important}
 html body.v5-body .v5-nav a b{font-size:11px!important;text-align:left!important;max-width:none!important}
 html body.v5-body .v5-nav-arrow{display:block!important}
 html body.v5-body .v5-user-mini{grid-template-columns:30px minmax(0,1fr) auto!important}.v5-user-copy,.v5-user-mini>a{display:flex!important}
}

/* ==== MOBILE: full-height easy app drawer + clean bottom nav ==== */
@media(max-width:760px){
 html body.v5-body .v5-shell{display:block!important}
 html body.v5-body .v5-main{padding:68px 10px 88px!important;max-width:100%!important;overflow-x:hidden!important}
 html body.v5-body .v5-sidebar{
   position:fixed!important;z-index:1000!important;left:0!important;top:0!important;bottom:0!important;
   width:min(92vw,360px)!important;min-width:0!important;height:100dvh!important;padding:10px 10px 18px!important;
   transform:translateX(-105%)!important;transition:transform .22s ease!important;overflow-y:auto!important;background:#080b10!important;
   box-shadow:24px 0 54px rgba(0,0,0,.46)!important;
 }
 html body.v5-body.mobile-nav-open .v5-sidebar{transform:translateX(0)!important}
 html body.v5-body .v5-sidebar .brand{height:62px!important;min-height:62px!important;border-radius:16px!important}
 html body.v5-body .v5-sidebar .brand-logo{max-height:44px!important}
 html body.v5-body .v5-nav{gap:4px!important}
 html body.v5-body .v5-nav-group{padding:5px 6px!important;border-radius:16px!important}
 html body.v5-body .v5-nav-label{font-size:7.5px!important;padding:2px 7px 4px!important}
 html body.v5-body .v5-nav a{min-height:38px!important;grid-template-columns:29px minmax(0,1fr) 12px!important;padding:4px 7px!important;gap:8px!important;border-radius:10px!important}
 html body.v5-body .v5-nav-icon{width:29px!important;height:29px!important;border-radius:9px!important}.v5-nav-icon svg{width:16px!important;height:16px!important}
 html body.v5-body .v5-nav a b{font-size:10.5px!important}.v5-nav-arrow{font-size:16px!important}
 html body.v5-body .v5-user-mini{margin-top:4px!important;padding:6px!important}
 html body.v5-body .mobile-headbar{height:58px!important;background:rgba(8,11,15,.98)!important;border-bottom:1px solid #1c232c!important;backdrop-filter:blur(14px)!important}
 html body.v5-body .mobile-headbar button,html body.v5-body .mobile-headbar a{background:#141a21!important;border:1px solid #252e39!important;color:#fff!important;border-radius:12px!important}
 html body.v5-body .mobile-bottom-nav{height:66px!important;left:0!important;right:0!important;bottom:0!important;border-radius:0!important;background:rgba(8,11,15,.98)!important;border:0!important;border-top:1px solid #1d252f!important;padding:5px 7px calc(5px + env(safe-area-inset-bottom))!important;box-shadow:0 -12px 28px rgba(0,0,0,.35)!important}
 html body.v5-body .mobile-bottom-nav a,html body.v5-body .mobile-bottom-nav button{color:#7f8995!important}.mobile-bottom-nav .active{color:#fff!important}
 html body.v5-body .mobile-bottom-nav .mobile-new-service{background:linear-gradient(135deg,var(--zgreen),var(--zgreen2))!important;color:#07120c!important}
 html body.v5-body .topbar,html body.v5-body .v5-desk-head,html body.v5-body .corp-page-head{margin-bottom:9px!important}
 html body.v5-body .topbar h1,html body.v5-body .v5-desk-head h1,html body.v5-body .corp-page-head h1{font-size:20px!important}
 html body.v5-body .topbar p,html body.v5-body .v5-desk-head p,html body.v5-body .corp-page-head p{font-size:9px!important;line-height:1.35!important}
 html body.v5-body .panel,html body.v5-body .unified-panel,html body.v5-body .service-card,html body.v5-body .customer-card-pro{border-radius:14px!important}
 html body.v5-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),html body.v5-body select,html body.v5-body textarea{font-size:16px!important;min-height:44px!important}
 html body.v5-body textarea{min-height:92px!important}
 html body.v5-body .modal,html body.v5-body dialog,html body.v5-body .comm-dialog,html body.v5-body .mobile-create-sheet>section{width:100%!important;max-width:none!important;margin:0!important;border-radius:22px 22px 0 0!important}
}

/* login + customer lookup + public field share */
html body.login-pro,html body.lookup-page,html body.field-public-page{background:var(--zbg)!important;color:var(--ztext)!important}
html body.login-pro .login-card,html body.lookup-page .lookup-card,html body.field-public-page .public-card,
html body.field-public-page section{background:linear-gradient(180deg,var(--zsurface),#0f141a)!important;color:var(--ztext)!important;border-color:var(--zline)!important}
html body.login-pro input,html body.lookup-page input,html body.field-public-page input,
html body.lookup-page select,html body.field-public-page select,html body.lookup-page textarea,html body.field-public-page textarea{background:#12171e!important;color:#fff!important;border-color:#2b3440!important}

/* print is intentionally white only during actual print */
@media print{html,body{background:#fff!important;color:#111!important}.v5-sidebar,.mobile-headbar,.mobile-bottom-nav,.mobile-nav-scrim{display:none!important}}


/* V7.7.8 — transparent white logo responsive placement */
html body.v5-body .v5-sidebar .brand{display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;background:#10151b!important;border:1px solid #202834!important;box-shadow:none!important}
html body.v5-body .v5-sidebar .brand-logo{display:block!important;width:100%!important;max-width:172px!important;height:auto!important;max-height:54px!important;object-fit:contain!important;object-position:center center!important;background:transparent!important}
html body.login-pro .login-card img,html body.lookup-page .lookup-brand img,html body.field-public-page .head img{display:block!important;width:min(100%,340px)!important;max-width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center center!important;background:transparent!important;filter:none!important}
html body.login-pro .login-card{overflow:hidden!important}
html body.login-pro .login-card img{margin:0 auto 2px!important}
html body.lookup-page .lookup-brand,html body.field-public-page .head{background:transparent!important}
@media (max-width:980px){
  html body.v5-body .v5-sidebar .brand{height:66px!important;min-height:66px!important;padding:8px 10px!important;margin:0 0 8px!important;border-radius:18px!important}
  html body.v5-body .v5-sidebar .brand-logo{max-width:178px!important;max-height:52px!important}
  html body.login-pro .login-card{width:min(420px,calc(100vw - 24px))!important;padding:24px 18px!important}
  html body.login-pro .login-card img{width:min(100%,300px)!important}
}
@media (max-width:640px){
  html body.v5-body .v5-sidebar .brand{height:62px!important;min-height:62px!important;padding:7px 8px!important}
  html body.v5-body .v5-sidebar .brand-logo{max-width:170px!important;max-height:48px!important}
  html body.login-pro .login-card img{width:min(100%,260px)!important}
}