@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap');

:root{
 --ctm-primary:#1657b0;--ctm-primary-dark:#0f3f87;--ctm-primary-light:#eaf1fc;--ctm-primary-2:#3f7fd6;
 --ctm-success:#1b8a4a;--ctm-success-bg:#e5f6ec;--ctm-success-text:#166534;
 --ctm-danger:#c62828;--ctm-danger-bg:#fdecea;--ctm-danger-text:#8a1c1c;
 --ctm-warn:#b7791f;--ctm-warn-bg:#fff6e0;--ctm-warn-text:#7a5c00;
 --ctm-purple:#7d3fb0;--ctm-teal:#0f8b8d;--ctm-amber:#b5722c;
 --ctm-ink:#1c2430;--ctm-muted:#6b7685;--ctm-border:#e6eaf0;--ctm-bg:#f4f6fa;
 --ctm-surface:#ffffff;--ctm-radius:16px;--ctm-radius-sm:10px;
 --ctm-shadow:0 1px 2px rgba(20,30,50,.05),0 10px 26px -14px rgba(20,30,50,.14);
 --ctm-shadow-hover:0 6px 14px rgba(20,30,50,.07),0 20px 38px -16px rgba(20,30,50,.20);
 --ctm-hero:linear-gradient(120deg,#0f3f87 0%,#1657b0 45%,#2f79d6 100%);
}

/* ============ Base ============ */
.ctm-wrap,.ctm-report-wrap,.ctm-login,.ctm-card,.ctm-form{font-family:'Vazirmatn',Tahoma,Arial,sans-serif}
.ctm-wrap{max-width:1200px;margin:24px auto 60px;padding:0 16px;color:var(--ctm-ink)}

/* ---- Hero title banner (page heading) ---- */
.ctm-wrap>h1,.ctm-report-wrap>h1{
 background:var(--ctm-hero);color:#fff;font-size:23px;font-weight:800;
 margin:0 0 20px;padding:26px 26px;border-radius:var(--ctm-radius);
 box-shadow:0 10px 28px -14px rgba(15,63,135,.55);position:relative;overflow:hidden
}
.ctm-wrap>h1::after,.ctm-report-wrap>h1::after{
 content:"";position:absolute;inset:0;
 background:radial-gradient(140px 140px at 92% -20%,rgba(255,255,255,.22),transparent 60%),
            radial-gradient(180px 180px at -10% 130%,rgba(255,255,255,.10),transparent 60%)
}
.ctm-wrap>p,.ctm-report-wrap>p{color:var(--ctm-muted);font-size:13.5px;margin:0 0 16px}

.ctm-card,.ctm-form{background:var(--ctm-surface);border:1px solid var(--ctm-border);border-radius:var(--ctm-radius);padding:22px;margin:18px 0;box-shadow:var(--ctm-shadow);transition:box-shadow .18s,transform .18s}
.ctm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:1100px){.ctm-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.ctm-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.ctm-grid{grid-template-columns:1fr}}
.ctm-grid .ctm-card{margin:0;border-top:3px solid var(--ctm-primary-2)}
.ctm-grid .ctm-card:hover{box-shadow:var(--ctm-shadow-hover);transform:translateY(-3px)}
.ctm-card h3{margin:0 0 6px;font-size:16px;font-weight:700}
.ctm-card p{margin:4px 0;color:var(--ctm-muted);font-size:13.5px}

/* ============ Forms ============ */
.ctm-form{display:grid;gap:12px}
.ctm-form label{font-size:13px;font-weight:600;color:#39424f;margin-bottom:-4px}
.ctm-form input,.ctm-form textarea,.ctm-form select,.ctm-login input{
 padding:12px 14px;border:1.5px solid var(--ctm-border);border-radius:var(--ctm-radius-sm);
 font-size:14px;font-family:inherit;color:var(--ctm-ink);background:#fbfcfe;transition:border-color .15s,box-shadow .15s
}
.ctm-form input:focus,.ctm-form textarea:focus,.ctm-form select:focus,.ctm-login input:focus{
 outline:none;border-color:var(--ctm-primary);box-shadow:0 0 0 3px var(--ctm-primary-light);background:#fff
}
.ctm-form textarea{min-height:80px;resize:vertical}

.ctm-btn,.ctm-form button,.ctm-login button{
 background:linear-gradient(180deg,var(--ctm-primary-2),var(--ctm-primary-dark));color:#fff;border:0;
 border-radius:var(--ctm-radius-sm);padding:12px 20px;text-decoration:none;display:inline-flex;
 align-items:center;justify-content:center;gap:6px;cursor:pointer;font-size:14.5px;font-weight:700;
 font-family:inherit;box-shadow:0 3px 10px rgba(22,87,176,.3);transition:transform .12s,box-shadow .12s
}
.ctm-btn:hover,.ctm-form button:hover,.ctm-login button:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(22,87,176,.38)}
.ctm-btn:active,.ctm-form button:active,.ctm-login button:active{transform:translateY(0)}
.ctm-btn-ok{background:linear-gradient(180deg,#2bb56a,var(--ctm-success));box-shadow:0 3px 10px rgba(27,138,74,.32)}
.ctm-btn-danger{background:linear-gradient(180deg,#e2564f,var(--ctm-danger));box-shadow:0 3px 10px rgba(198,40,40,.32)}

/* ============ Table ============ */
.ctm-table{width:100%;border-collapse:separate;border-spacing:0;margin-top:18px;font-size:13.5px;overflow:hidden;border-radius:var(--ctm-radius-sm);border:1px solid var(--ctm-border);box-shadow:var(--ctm-shadow)}
.ctm-table th{background:linear-gradient(180deg,#f8fafd,#f1f4f9);color:#2c3644;font-weight:700;text-align:right;padding:12px;border-bottom:1px solid var(--ctm-border);font-size:12.5px}
.ctm-table td{padding:12px;border-bottom:1px solid var(--ctm-border);color:var(--ctm-ink)}
.ctm-table tr:last-child td{border-bottom:0}
.ctm-table tbody tr:nth-child(even){background:#fafbfd}
.ctm-table tbody tr:hover{background:var(--ctm-primary-light)}
.ctm-table a{color:var(--ctm-primary);font-weight:700;text-decoration:none}
.ctm-table a:hover{text-decoration:underline}

/* ============ Alerts ============ */
.ctm-alert{padding:13px 16px;background:var(--ctm-warn-bg);color:var(--ctm-warn-text);border-radius:var(--ctm-radius-sm);margin:10px 0;font-size:13.5px;border-right:4px solid var(--ctm-warn);box-shadow:0 1px 2px rgba(0,0,0,.03)}
.ctm-alert-ok{background:var(--ctm-success-bg);color:var(--ctm-success-text);border-right-color:var(--ctm-success)}

/* ============ Login page ============ */
.ctm-login{max-width:420px;margin:60px auto;text-align:center;position:relative;overflow:hidden;border:none;box-shadow:0 20px 50px -20px rgba(15,63,135,.35)}
.ctm-login::before{content:"";position:absolute;top:-90px;left:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,var(--ctm-primary-light),transparent 70%);z-index:0}
.ctm-login::after{content:"";position:absolute;bottom:-100px;right:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#eef8f1,transparent 70%);z-index:0}
.ctm-login>*{position:relative;z-index:1}
.ctm-login h2{margin:0 0 4px;font-size:22px;font-weight:800}
.ctm-login h2::before{content:"🧪";display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0 auto 12px;font-size:30px;background:var(--ctm-hero);border-radius:50%;box-shadow:0 8px 20px -8px rgba(15,63,135,.5)}
.ctm-login form{text-align:right;margin-top:16px;display:grid;gap:10px}
.ctm-login label{display:block;font-size:13px;font-weight:600;color:#555;margin:6px 2px 2px}
.ctm-login button{width:100%;margin-top:8px;padding:13px;font-size:15px}
.ctm-login p.ctm-sub{color:var(--ctm-muted);margin:0 0 4px;font-size:13.5px}

/* ============ Grade "chip" radio selector ============ */
.ctm-radio-group{display:flex;flex-wrap:wrap;gap:8px}
.ctm-radio-chip{position:relative;border:1.5px solid var(--ctm-border);border-radius:20px;padding:9px 18px;cursor:pointer;background:#fbfcfe;font-size:13.5px;font-weight:600;transition:.15s}
.ctm-radio-chip input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.ctm-radio-chip:has(input:checked){background:linear-gradient(180deg,var(--ctm-primary-2),var(--ctm-primary-dark));color:#fff;border-color:var(--ctm-primary);box-shadow:0 3px 10px rgba(22,87,176,.32)}
.ctm-radio-chip:has(input:focus-visible){outline:2px solid var(--ctm-primary);outline-offset:2px}

/* ============ Badges / confirmation flow ============ */
.ctm-badge{display:inline-block;padding:4px 11px;border-radius:14px;font-size:12px;font-weight:700;text-decoration:none}
.ctm-badge-warn{background:var(--ctm-warn-bg);color:var(--ctm-warn-text)}
.ctm-badge-ok{background:var(--ctm-success-bg);color:var(--ctm-success-text)}
.ctm-confirm{background:linear-gradient(180deg,#fbfcfe,#f5f8fc);border:1.5px dashed #b8c2d1;border-radius:var(--ctm-radius);padding:20px;margin:16px 0}
.ctm-confirm .ctm-table th{width:40%;background:#f7f9fc}
.ctm-confirm-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}

/* ============ KPI cards ============ */
.ctm-report-wrap{max-width:1400px}
.ctm-report-filter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--ctm-surface);border:1px solid var(--ctm-border);border-radius:var(--ctm-radius);padding:16px;margin:16px 0;box-shadow:var(--ctm-shadow)}
.ctm-report-filter select,.ctm-report-filter input{min-height:36px;border-radius:8px;border:1.5px solid var(--ctm-border);padding:0 10px;font-family:inherit}
.ctm-report-filter label{font-size:13px;color:var(--ctm-muted);display:inline-flex;align-items:center;gap:4px}

.ctm-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:18px 0}
.ctm-kpi{background:var(--ctm-surface);border:1px solid var(--ctm-border);border-radius:var(--ctm-radius);padding:18px;text-align:center;position:relative;overflow:hidden;box-shadow:var(--ctm-shadow);transition:transform .15s,box-shadow .15s}
.ctm-kpi:hover{transform:translateY(-4px);box-shadow:var(--ctm-shadow-hover)}
.ctm-kpi .dashicons{display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin:0 auto 10px;border-radius:50%;font-size:19px;color:#fff}
.ctm-kpi b{display:block;font-size:27px;font-weight:800;margin-bottom:4px;color:var(--ctm-ink)}
.ctm-kpi-label{color:var(--ctm-muted);font-size:12.5px;font-weight:600}
.ctm-kpi-1{border-top:3px solid var(--ctm-primary)}
.ctm-kpi-1 .dashicons{background:linear-gradient(160deg,var(--ctm-primary-2),var(--ctm-primary-dark))}
.ctm-kpi-2{border-top:3px solid var(--ctm-success)}
.ctm-kpi-2 .dashicons{background:linear-gradient(160deg,#2bb56a,var(--ctm-success))}
.ctm-kpi-3{border-top:3px solid var(--ctm-amber)}
.ctm-kpi-3 .dashicons{background:linear-gradient(160deg,#d99a4e,var(--ctm-amber))}
.ctm-kpi-4{border-top:3px solid var(--ctm-warn)}
.ctm-kpi-4 .dashicons{background:linear-gradient(160deg,#dba940,var(--ctm-warn))}
.ctm-kpi-5{border-top:3px solid var(--ctm-purple)}
.ctm-kpi-5 .dashicons{background:linear-gradient(160deg,#9c63cf,var(--ctm-purple))}

.ctm-report-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ctm-report-card{background:var(--ctm-surface);border:1px solid var(--ctm-border);border-radius:var(--ctm-radius);padding:18px;box-shadow:var(--ctm-shadow);position:relative}
.ctm-report-card::before{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--ctm-primary-2),var(--ctm-primary))}
.ctm-report-card{padding-inline-start:22px}
.ctm-report-card h2{margin:2px 0 12px;font-size:16.5px;font-weight:800}
.ctm-report-card-full{grid-column:1/-1}
.ctm-scroll{overflow:auto}
.ctm-report-card table{min-width:620px}
.ctm-note{margin-top:18px;background:linear-gradient(180deg,#f7f9fc,#eef2f7);border-right:4px solid var(--ctm-primary);padding:14px 16px;border-radius:var(--ctm-radius-sm);font-size:13px;color:#444}
.ctm-note-inline{color:var(--ctm-muted);font-size:12.5px;margin:-6px 0 10px}
@media(max-width:900px){.ctm-report-grid{grid-template-columns:1fr}}

/* ---- Horizontal bar mini-charts (city / producer volume) ---- */
.ctm-bars{display:flex;flex-direction:column;gap:11px}
.ctm-bar-row{display:grid;grid-template-columns:110px 1fr 68px;align-items:center;gap:10px;font-size:13px}
.ctm-bar-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.ctm-bar-track{background:#eef1f7;border-radius:7px;height:15px;overflow:hidden}
.ctm-bar-fill{display:block;height:100%;background:linear-gradient(90deg,var(--ctm-primary),var(--ctm-primary-2));border-radius:7px;transition:width .4s ease}
.ctm-bar-value{text-align:left;color:#444;font-weight:700}

/* ---- Donut charts (stage acceptance ratio) ---- */
.ctm-donut-grid{display:flex;flex-wrap:wrap;gap:24px}
.ctm-donut-item{text-align:center;font-size:12px}
.ctm-donut{width:100px;height:100px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;position:relative;box-shadow:0 4px 14px -6px rgba(20,30,50,.25)}
.ctm-donut::after{content:"";position:absolute;inset:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.ctm-donut span{position:relative;z-index:1;font-size:12px;font-weight:800}
.ctm-donut-legend{color:#555;font-weight:600}
.ctm-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin:0 3px}
.ctm-dot-ok{background:var(--ctm-success)}
.ctm-dot-bad{background:var(--ctm-danger)}
.ctm-dot-warn{background:var(--ctm-warn)}

/* ---- Producer x grade quality pills ---- */
.ctm-quality-pill{display:inline-block;margin-right:6px;padding:3px 10px;border-radius:10px;font-size:11px;font-weight:800}
.ctm-q-good{background:var(--ctm-success-bg);color:var(--ctm-success-text)}
.ctm-q-mid{background:var(--ctm-warn-bg);color:var(--ctm-warn-text)}
.ctm-q-bad{background:var(--ctm-danger-bg);color:var(--ctm-danger-text)}

/* ---- Elementor embed helper: constrains the shortcode nicely inside any column ---- */
.elementor-widget-shortcode .ctm-login,.elementor-widget-shortcode .ctm-wrap{margin-top:0;margin-bottom:0}

/* ---- Frontend project tabs (active / archived / due) ---- */
.ctm-tabs{display:flex;gap:8px;margin:14px 0 4px;flex-wrap:wrap}
.ctm-tab-link{padding:9px 18px;border-radius:20px;border:1.5px solid var(--ctm-border);background:#fbfcfe;color:#444;text-decoration:none;font-size:13.5px;font-weight:700;transition:.15s}
.ctm-tab-link:hover{border-color:var(--ctm-primary-2)}
.ctm-tab-link.active{background:linear-gradient(180deg,var(--ctm-primary-2),var(--ctm-primary-dark));color:#fff;border-color:var(--ctm-primary);box-shadow:0 3px 10px rgba(22,87,176,.3)}

/* ---- Search row (project search) ---- */
.ctm-search-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 16px}
.ctm-search-row input[type=search]{flex:1;min-width:180px;padding:11px 14px;border:1.5px solid var(--ctm-border);border-radius:var(--ctm-radius-sm);font-family:inherit;font-size:14px;background:#fbfcfe}
.ctm-search-row input[type=search]:focus{outline:none;border-color:var(--ctm-primary);box-shadow:0 0 0 3px var(--ctm-primary-light)}
.ctm-btn-outline{background:#fff;color:var(--ctm-primary);border:1.5px solid var(--ctm-primary);box-shadow:none}
.ctm-btn-outline:hover{background:var(--ctm-primary-light)}

/* ---- Table horizontal scroll on narrow screens (frontend) ---- */
.ctm-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ctm-table-scroll .ctm-table{min-width:640px}

/* ---- Print / "Export to PDF" (uses the browser's native print-to-PDF, no server dependency) ---- */
@media print{
 #adminmenumain,#wpadminbar,#wpfooter,#screen-meta,#screen-meta-links,
 .ctm-report-filter,.ctm-btn,.button,.nav-tab-wrapper,
 .ctm-confirm-actions,.ctm-form,.ctm-print-btn,
 .ctm-no-print,.ctm-tabs,.ctm-search-row,.ctm-kpis,.ctm-alert,
 .ctm-wrap>h1,.ctm-wrap>p,.ctm-grid{display:none!important}
 #wpcontent,#wpbody-content,.wrap{margin:0!important;padding:0!important}
 body{background:#fff!important}
 .ctm-table,.ctm-print-table,table.widefat{width:100%!important;box-shadow:none!important}
 .ctm-table-scroll{overflow:visible!important}
 .ctm-table-scroll .ctm-table{min-width:0!important;width:100%!important;font-size:11px!important;border-collapse:collapse!important}
 .ctm-table th,.ctm-table td{padding:4px 6px!important;border:1px solid #999!important}
 .ctm-card,.ctm-report-card{box-shadow:none!important;border:none!important;padding:0!important;margin:0!important}
 .ctm-card h2{font-size:15px;margin:0 0 10px}
}

/* ---- Responsive polish ---- */
@media(max-width:600px){
 .ctm-wrap{padding:0 12px;margin:16px auto 40px}
 .ctm-wrap>h1,.ctm-report-wrap>h1{font-size:19px;padding:20px}
 .ctm-card,.ctm-form{padding:16px}
 .ctm-kpis{grid-template-columns:repeat(2,1fr)}
 .ctm-report-grid{grid-template-columns:1fr}
 .ctm-donut-grid{justify-content:space-around}
 .ctm-confirm-actions{flex-direction:column}
 .ctm-confirm-actions form{width:100%}
 .ctm-confirm-actions button{width:100%}
 .ctm-tab-link{flex:1;text-align:center;padding:9px 10px;font-size:12.5px}
}
@media(max-width:400px){
 .ctm-kpis{grid-template-columns:1fr 1fr}
 .ctm-kpi b{font-size:22px}
}
