/*
Theme Name: eSIM Europa - Ghid Suport
Theme URI: https://esimeuropa.ro
Author: eSIM Europa
Author URI: https://esimeuropa.ro
Description: Temă dedicată pentru ghidul intern de suport eSIM Europa. Bază de cunoștințe cu răspunsuri gata de copiat pentru clienți, ghid de escaladare către furnizor (AirHub) și panou de gestionare a cazurilor. Optimizată pentru desktop și telefon. Acces protejat cu parolă.
Version: 1.0
Requires at least: 5.0
Tested up to: 6.7
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: esim-suport
*/

/* ============================================================
   Resetare minimă pentru a evita conflictele cu WordPress
   ============================================================ */
html{margin:0 !important;}
* html #wpadminbar{display:none;}
body.esim-kb-body{margin:0;padding:0;}
img{max-width:100%;height:auto;}


  :root{
    --ink:#14201C; --paper:#F3F6F1; --surface:#FFFFFF;
    --signal:#0E7C66; --signal-dark:#0A5A4B; --signal-bg:#E3F1EC;
    --amber:#B8722A; --amber-bg:#FBF0E2; --amber-ink:#7A4C1D;
    --blue:#2C6BAF; --blue-bg:#E6EFF8; --blue-ink:#1C4C82;
    --border:#DDE2D8; --muted:#6B7268; --radius:10px;
    --font-mono:'IBM Plex Mono',ui-monospace,monospace;
    --font-sans:'IBM Plex Sans',system-ui,sans-serif;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{font-family:var(--font-sans);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}
  a{color:var(--signal-dark);}

  header{position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--border);padding:18px 24px 14px;}
  .header-top{display:flex;align-items:baseline;justify-content:space-between;max-width:1180px;margin:0 auto 14px;gap:16px;flex-wrap:wrap;}
  .brand{display:flex;align-items:baseline;gap:10px;}
  .brand .mark{font-family:var(--font-mono);font-weight:600;font-size:13px;letter-spacing:.08em;color:var(--signal-dark);background:var(--signal-bg);border:1px solid var(--signal);padding:3px 8px;border-radius:5px;}
  .brand h1{font-size:19px;font-weight:600;margin:0;}
  .brand .sub{font-size:12.5px;color:var(--muted);font-family:var(--font-mono);}

  .search-wrap{max-width:1180px;margin:0 auto;position:relative;}
  #search{width:100%;font-family:var(--font-sans);font-size:15px;padding:12px 44px 12px 16px;border-radius:var(--radius);border:1.5px solid var(--border);background:var(--surface);color:var(--ink);outline:none;transition:border-color .15s;}
  #search:focus{border-color:var(--signal);}
  .search-wrap svg{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--muted);}

  .chips{max-width:1180px;margin:14px auto 0;display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;}
  .chip{flex:none;font-family:var(--font-mono);font-size:12.5px;letter-spacing:.02em;padding:7px 13px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--ink);cursor:pointer;white-space:nowrap;transition:all .12s;}
  .chip:hover{border-color:var(--signal);}
  .chip.active{background:var(--signal);border-color:var(--signal);color:#fff;}

  main{max-width:1180px;margin:0 auto;padding:22px 24px 80px;}
  .result-meta{font-size:13px;color:var(--muted);margin-bottom:14px;font-family:var(--font-mono);}

  .rules-banner{background:var(--amber-bg);border:1px solid var(--amber);border-radius:var(--radius);padding:16px 18px;margin-bottom:26px;}
  .rules-banner .rb-head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14.5px;color:var(--amber-ink);margin-bottom:10px;}
  .rules-banner .rb-head svg{width:16px;height:16px;stroke:var(--amber-ink);flex:none;}
  .rule-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 20px;}
  .rule-item{font-size:13.5px;display:flex;gap:8px;align-items:flex-start;}
  .rule-item .rcode{font-family:var(--font-mono);font-weight:600;color:var(--amber-ink);flex:none;}

  .grid{display:grid;gap:14px;}
  .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);display:flex;overflow:hidden;}
  .card .tab{flex:none;width:52px;display:flex;align-items:flex-start;justify-content:center;padding-top:16px;background:var(--signal-bg);border-right:1px solid var(--border);}
  .card .tab span{font-family:var(--font-mono);font-weight:600;font-size:12.5px;color:var(--signal-dark);}
  .card.ah .tab{background:var(--amber-bg);}
  .card.ah .tab span{color:var(--amber-ink);}
  .card-body{padding:14px 18px;flex:1;min-width:0;}
  .card h3{margin:0 0 4px;font-size:15.5px;font-weight:600;}
  .tags{font-size:11px;color:var(--muted);font-family:var(--font-mono);letter-spacing:.02em;margin-bottom:12px;text-transform:lowercase;}

  /* Agent note block */
  .agent-note{background:var(--blue-bg);border-left:3px solid var(--blue);border-radius:0;padding:9px 12px;margin-bottom:12px;font-size:13.5px;color:var(--blue-ink);}
  .agent-note .an-label{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;display:block;margin-bottom:3px;opacity:.85;}
  .agent-note .an-body{white-space:pre-line;color:#20364E;}

  /* Client message block */
  .client-msg{border:1px dashed var(--signal);border-radius:8px;padding:11px 13px;background:#FAFDFB;}
  .cm-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap;}
  .cm-label{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--signal-dark);display:flex;align-items:center;gap:6px;}
  .cm-label svg{width:13px;height:13px;stroke:var(--signal-dark);}
  .client-text{font-size:14.5px;color:#1E2E28;white-space:pre-line;}
  .client-text .ph{background:#FDF2D8;color:#8A5A16;border-radius:3px;padding:0 3px;font-weight:500;}

  .copy-btn{flex:none;display:flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:12.5px;font-weight:500;color:#fff;background:var(--signal);border:1px solid var(--signal);padding:7px 13px;border-radius:7px;cursor:pointer;transition:all .12s;}
  .copy-btn:hover{background:var(--signal-dark);}
  .copy-btn svg{width:13px;height:13px;stroke:#fff;}
  .copy-btn.copied{background:var(--signal-dark);}

  .no-client{font-size:13px;color:var(--muted);font-style:italic;padding:4px 0;}

  .empty{text-align:center;padding:60px 20px;color:var(--muted);}
  .section-title{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:34px 0 10px;padding-top:4px;}
  .section-title:first-of-type{margin-top:0;}

  .toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:10px 18px;border-radius:8px;font-size:13.5px;opacity:0;pointer-events:none;transition:all .2s;z-index:50;}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

  /* ---- View tabs ---- */
  .viewtabs{display:flex;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:4px;}
  .vtab{display:flex;align-items:center;gap:7px;font-family:var(--font-sans);font-size:13.5px;font-weight:500;color:var(--muted);background:transparent;border:none;padding:7px 14px;border-radius:6px;cursor:pointer;transition:all .12s;}
  .vtab svg{width:15px;height:15px;stroke:currentColor;}
  .vtab:hover{color:var(--ink);}
  .vtab.active{background:var(--signal);color:#fff;}
  .vtab-badge{background:rgba(255,255,255,.25);color:inherit;font-size:11px;font-weight:600;min-width:18px;height:18px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;}
  .vtab:not(.active) .vtab-badge{background:var(--signal-bg);color:var(--signal-dark);}

  /* ---- Cases toolbar ---- */
  .cases-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
  .ct-left{display:flex;gap:10px;align-items:center;flex:1;min-width:260px;}
  .ct-right{display:flex;gap:8px;}
  .case-search-wrap{flex:1;max-width:360px;}
  #case-search{width:100%;font-family:var(--font-sans);font-size:14px;padding:9px 14px;border-radius:8px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);outline:none;}
  #case-search:focus{border-color:var(--signal);}

  .btn-primary{display:flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:13.5px;font-weight:500;color:#fff;background:var(--signal);border:1px solid var(--signal);padding:9px 15px;border-radius:8px;cursor:pointer;transition:background .12s;white-space:nowrap;}
  .btn-primary:hover{background:var(--signal-dark);}
  .btn-primary svg{width:15px;height:15px;stroke:#fff;}
  .btn-ghost{display:flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:13px;font-weight:500;color:var(--ink);background:var(--surface);border:1px solid var(--border);padding:9px 13px;border-radius:8px;cursor:pointer;transition:all .12s;white-space:nowrap;}
  .btn-ghost:hover{border-color:var(--signal);color:var(--signal-dark);}
  .btn-ghost svg{width:14px;height:14px;stroke:currentColor;}

  .backup-note{font-size:12px;color:var(--muted);margin-bottom:16px;line-height:1.5;background:var(--amber-bg);border:1px solid var(--amber);border-radius:8px;padding:9px 12px;}
  .backup-note b{color:var(--amber-ink);}

  /* ---- Case filters ---- */
  .case-filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;}
  .cfilter{font-family:var(--font-mono);font-size:12px;padding:6px 12px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--ink);cursor:pointer;transition:all .12s;}
  .cfilter:hover{border-color:var(--signal);}
  .cfilter.active{background:var(--ink);border-color:var(--ink);color:#fff;}

  /* ---- Case cards ---- */
  .case-grid{display:grid;gap:12px;}
  .case-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;cursor:pointer;transition:border-color .12s,box-shadow .12s;border-left-width:4px;}
  .case-card:hover{border-color:var(--signal);box-shadow:0 2px 8px rgba(20,32,28,.06);}
  .case-card.st-nou{border-left-color:#2C6BAF;}
  .case-card.st-lucru{border-left-color:#B8722A;}
  .case-card.st-asteptare{border-left-color:#8A5CC7;}
  .case-card.st-rezolvat{border-left-color:#0E7C66;}
  .cc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px;}
  .cc-name{font-size:15.5px;font-weight:600;}
  .cc-meta{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-top:2px;display:flex;flex-wrap:wrap;gap:4px 12px;}
  .cc-meta span{white-space:nowrap;}
  .cc-badge{flex:none;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:20px;white-space:nowrap;}
  .badge-nou{background:var(--blue-bg);color:var(--blue-ink);}
  .badge-lucru{background:var(--amber-bg);color:var(--amber-ink);}
  .badge-asteptare{background:#F0E9FA;color:#5B3B96;}
  .badge-rezolvat{background:var(--signal-bg);color:var(--signal-dark);}
  .cc-body{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin-top:10px;}
  .cc-field .lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:2px;}
  .cc-field .val{font-size:13.5px;color:#2A3A34;white-space:pre-line;}
  .cc-field .val.empty-val{color:#B4B8B0;font-style:italic;}
  .cc-time{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-top:10px;}

  /* ---- Modal ---- */
  .modal-overlay{position:fixed;inset:0;background:rgba(20,32,28,.45);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;}
  .modal{background:var(--surface);border-radius:14px;width:100%;max-width:640px;max-height:90vh;overflow-y:auto;box-shadow:0 12px 40px rgba(20,32,28,.25);}
  .modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px 14px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:2;}
  .modal-head h2{margin:0;font-size:17px;font-weight:600;}
  .modal-close{background:transparent;border:none;cursor:pointer;padding:4px;border-radius:6px;color:var(--muted);}
  .modal-close:hover{background:var(--paper);color:var(--ink);}
  .modal-close svg{width:20px;height:20px;stroke:currentColor;}
  .modal-body{padding:18px 22px;}
  .form-row.two{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
  .field{margin-bottom:14px;}
  .field label{display:block;font-size:12.5px;font-weight:500;color:var(--ink);margin-bottom:5px;}
  .field label .opt{font-weight:400;color:var(--muted);font-size:11.5px;}
  .field input,.field textarea{width:100%;font-family:var(--font-sans);font-size:14px;padding:9px 12px;border-radius:8px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);outline:none;transition:border-color .12s;resize:vertical;}
  .field input:focus,.field textarea:focus{border-color:var(--signal);}
  .status-picker{display:flex;gap:7px;flex-wrap:wrap;}
  .status-opt{font-size:13px;font-weight:500;padding:8px 14px;border-radius:8px;border:1.5px solid var(--border);background:var(--surface);cursor:pointer;transition:all .12s;color:var(--muted);}
  .status-opt:hover{border-color:var(--signal-dark);}
  .status-opt.sel[data-status="nou"]{background:var(--blue-bg);border-color:var(--blue);color:var(--blue-ink);}
  .status-opt.sel[data-status="lucru"]{background:var(--amber-bg);border-color:var(--amber);color:var(--amber-ink);}
  .status-opt.sel[data-status="asteptare"]{background:#F0E9FA;border-color:#8A5CC7;color:#5B3B96;}
  .status-opt.sel[data-status="rezolvat"]{background:var(--signal-bg);border-color:var(--signal);color:var(--signal-dark);}
  .modal-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 22px 18px;border-top:1px solid var(--border);position:sticky;bottom:0;background:var(--surface);}
  .foot-right{display:flex;gap:8px;margin-left:auto;}
  .btn-danger-ghost{display:flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:13px;font-weight:500;color:#A32D2D;background:transparent;border:1px solid #E2B4B4;padding:9px 13px;border-radius:8px;cursor:pointer;transition:all .12s;}
  .btn-danger-ghost:hover{background:#FCEBEB;}
  .btn-danger-ghost svg{width:14px;height:14px;stroke:currentColor;}

  @media (max-width:640px){
    header{padding:14px 14px 12px;}
    main{padding:18px 14px 80px;}
    .brand h1{font-size:16.5px;}
    .brand .sub{display:none;}
    .card{flex-direction:column;}
    .card .tab{width:100%;flex-direction:row;padding:8px 14px;border-right:none;border-bottom:1px solid var(--border);}
    .header-top{align-items:flex-start;flex-direction:column;gap:12px;}
    .viewtabs{width:100%;}
    .vtab{flex:1;justify-content:center;padding:10px 14px;font-size:14px;}
    .cc-body{grid-template-columns:1fr;}
    .form-row.two{grid-template-columns:1fr;gap:0;}
    .cases-toolbar{flex-direction:column;align-items:stretch;}
    .ct-left{flex-direction:column;align-items:stretch;min-width:0;}
    .case-search-wrap{max-width:100%;}
    #new-case-btn{justify-content:center;padding:12px 15px;}
    .ct-right{width:100%;}
    .ct-right .btn-ghost{flex:1;justify-content:center;padding:11px 13px;}
    .rule-grid{grid-template-columns:1fr;}
    .modal{max-height:94vh;border-radius:14px 14px 0 0;align-self:flex-end;}
    .modal-overlay{align-items:flex-end;padding:0;}
    .modal-body{padding:16px 16px;}
    .modal-head,.modal-foot{padding-left:16px;padding-right:16px;}
    .modal-foot{flex-wrap:wrap;}
    .btn-danger-ghost{order:2;width:100%;justify-content:center;}
    .foot-right{width:100%;}
    .foot-right .btn-primary,.foot-right .btn-ghost{flex:1;justify-content:center;padding:12px;}
    .status-opt{flex:1;text-align:center;min-width:calc(50% - 4px);}
    /* input-uri 16px ca iOS să nu facă zoom automat la focus */
    #search,#case-search,.field input,.field textarea,#lock-input{font-size:16px;}
    .copy-btn{padding:9px 13px;}
    .cc-badge{font-size:11px;}
  }

  @media (max-width:420px){
    .brand .mark{display:none;}
    .cfilter{font-size:11px;padding:6px 10px;}
    .chip{font-size:12px;}
  }

  /* ---- Lock screen ---- */
  #lock-screen{position:fixed;inset:0;z-index:200;background:var(--paper);display:flex;align-items:center;justify-content:center;padding:20px;}
  .lock-box{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:36px 34px;width:100%;max-width:380px;box-shadow:0 12px 40px rgba(20,32,28,.10);text-align:center;}
  .lock-box .mark{font-family:var(--font-mono);font-weight:600;font-size:12px;letter-spacing:.08em;color:var(--signal-dark);background:var(--signal-bg);border:1px solid var(--signal);padding:4px 10px;border-radius:5px;display:inline-block;margin-bottom:20px;}
  .lock-box h1{font-size:19px;font-weight:600;margin:0 0 6px;}
  .lock-box p{font-size:13.5px;color:var(--muted);margin:0 0 22px;}
  .lock-box .lock-icon{width:44px;height:44px;stroke:var(--signal);margin-bottom:14px;}
  #lock-input{width:100%;font-family:var(--font-sans);font-size:16px;text-align:center;letter-spacing:.15em;padding:12px 14px;border-radius:10px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);outline:none;transition:border-color .12s;margin-bottom:12px;}
  #lock-input:focus{border-color:var(--signal);}
  #lock-input.err{border-color:#E24B4A;animation:shake .35s;}
  @keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
  #lock-btn{width:100%;font-family:var(--font-sans);font-size:15px;font-weight:500;color:#fff;background:var(--signal);border:none;padding:12px;border-radius:10px;cursor:pointer;transition:background .12s;}
  #lock-btn:hover{background:var(--signal-dark);}
  .lock-err{font-size:12.5px;color:#A32D2D;margin-top:10px;min-height:16px;}
  body.locked{overflow:hidden;}
  body.locked header,body.locked main,body.locked .toast{filter:blur(4px);pointer-events:none;}