/* OneGIG consistency frame for the studios. Sign-in gate, strata bar, slim
   petrol header, user chip, sign-out, and the Send to OneGIG panel. Brand
   tokens match the hub; nothing here touches a studio's own engine. */
:root{
  --og-petrol:#003D44; --og-green:#48822A; --og-lime:#C1FA00;
  --og-ink:#12262A; --og-muted:#54696B; --og-line:#DDE6E3; --og-tint:#EAF1EE;
  --og-gig:#48822A; --og-afico:#ED1C24; --og-srw:#FEB600; --og-bcoms:#002475;
  --og-font:"Neo Sans Arabic","29LT Zawi","Cairo",Tahoma,Verdana,sans-serif;
}
/* While auth is undecided or denied, hide the studio app behind the frame. */
body.og-pre .og-appwrap, body.og-denied .og-appwrap{display:none !important;}
body.og-pre .og-login{display:flex;} body.og-denied .og-denied-screen{display:flex;}
.og-login, .og-denied-screen{display:none;}

.og-strata{display:flex; height:5px;}
.og-strata i{flex:1;}
.og-strata i:nth-child(1){background:var(--og-gig);} .og-strata i:nth-child(2){background:var(--og-afico);}
.og-strata i:nth-child(3){background:var(--og-srw);} .og-strata i:nth-child(4){background:var(--og-bcoms);}

.og-header{background:var(--og-petrol); color:#fff; display:flex; align-items:center; gap:12px;
  padding:9px 20px; font-family:var(--og-font);}
.og-header .og-brand{font-weight:800; font-size:.95rem; letter-spacing:.01em;}
.og-header .og-brand b{color:var(--og-lime);}
.og-header .og-sub{font-weight:500; opacity:.82; font-size:.9rem;}
.og-header .og-spacer{flex:1;}
.og-chip{display:flex; align-items:center; gap:8px; font-size:.82rem;}
.og-chip .og-av{width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.16); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:.72rem;}
.og-chip .og-who b{display:block; line-height:1.15;} .og-chip .og-who span{opacity:.7; font-size:.72rem;}
.og-hbtn{background:rgba(255,255,255,.12); color:#fff; border:0; border-radius:8px; padding:7px 11px;
  font-size:.8rem; font-weight:600; cursor:pointer;}
.og-hbtn:hover{background:rgba(255,255,255,.22);}

/* Login + no-access, full-screen over the studio. */
.og-login, .og-denied-screen{position:fixed; inset:0; z-index:9000; background:linear-gradient(135deg,#003D44,#0a5661 60%,#48822A);
  align-items:center; justify-content:center; padding:24px; font-family:var(--og-font);}
.og-card{background:#fff; width:100%; max-width:400px; border-radius:16px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.3);}
.og-card .og-cap{display:flex; height:6px;}
.og-card .og-cap i{flex:1;} .og-card .og-cap i:nth-child(1){background:var(--og-gig);} .og-card .og-cap i:nth-child(2){background:var(--og-afico);}
.og-card .og-cap i:nth-child(3){background:var(--og-srw);} .og-card .og-cap i:nth-child(4){background:var(--og-bcoms);}
.og-card .og-body{padding:26px 28px 30px;}
.og-card h1{font-size:1.35rem; color:var(--og-petrol); margin:0; text-align:center;}
.og-card .og-kicker{text-align:center; color:var(--og-muted); font-weight:700; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; margin:4px 0 18px;}
.og-card label{display:block; font-size:.8rem; font-weight:700; color:var(--og-ink); margin:12px 0 5px;}
.og-card input, .og-card select{width:100%; box-sizing:border-box; border:1px solid var(--og-line); border-radius:9px; padding:11px 12px; font-size:.95rem; font-family:inherit; background:#fff; color:var(--og-ink);}
.og-card input:focus, .og-card select:focus{outline:none; border-color:var(--og-green); box-shadow:0 0 0 3px rgba(72,130,42,.15);}
.og-card .og-primary{width:100%; margin-top:18px; background:var(--og-petrol); color:#fff; border:0; border-radius:10px; padding:12px; font-size:.95rem; font-weight:700; cursor:pointer;}
.og-card .og-primary:hover{background:#0a4c54;} .og-card .og-primary:disabled{opacity:.6; cursor:default;}
.og-card .og-err{display:none; background:#fdecec; color:#b02020; border-radius:8px; padding:9px 11px; font-size:.82rem; margin-top:12px;}
.og-card .og-err.show{display:block;}
.og-card .og-note{text-align:center; color:var(--og-muted); font-size:.78rem; margin-top:16px;}
.og-card .og-lang{position:absolute; top:20px; inset-inline-end:22px; background:#fff; border:1px solid var(--og-line); border-radius:20px; padding:6px 14px; font-weight:700; font-size:.82rem; cursor:pointer;}

/* Send to OneGIG panel. */
.og-panel-back{position:fixed; inset:0; z-index:9500; display:none; background:rgba(0,26,29,.55); padding:24px; overflow:auto;
  font-family:var(--og-font);}
.og-panel-back.show{display:grid; place-items:start center;}
.og-panel{background:#fff; width:100%; max-width:760px; border-radius:14px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.3); margin-top:4vh;}
.og-panel .og-ptop{display:flex; height:6px;} .og-panel .og-ptop i{flex:1;}
.og-panel .og-ptop i:nth-child(1){background:var(--og-gig);} .og-panel .og-ptop i:nth-child(2){background:var(--og-afico);}
.og-panel .og-ptop i:nth-child(3){background:var(--og-srw);} .og-panel .og-ptop i:nth-child(4){background:var(--og-bcoms);}
.og-panel .og-pbody{padding:22px 26px 26px;}
.og-panel h2{margin:0 0 4px; font-size:1.15rem; color:var(--og-petrol);}
.og-panel .og-phint{color:var(--og-muted); font-size:.84rem; margin:0 0 16px;}
.og-panel .og-two{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.og-panel label{display:block; font-size:.74rem; font-weight:700; color:var(--og-ink); margin:10px 0 5px;}
.og-panel input, .og-panel textarea, .og-panel select{width:100%; box-sizing:border-box; border:1px solid var(--og-line); border-radius:9px; padding:9px 11px; font-size:.9rem; font-family:inherit;}
.og-panel textarea{min-height:70px; resize:vertical;}
.og-panel .og-check{display:flex; align-items:center; gap:8px; font-size:.86rem; font-weight:600; margin-top:14px;}
.og-panel .og-check input{width:auto;}
.og-panel .og-condo{background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; border-radius:9px; padding:10px 12px; font-size:.8rem; margin-top:12px; line-height:1.5;}
.og-panel .og-row{display:flex; gap:10px; margin-top:20px;}
.og-panel .og-go{flex:1; background:var(--og-petrol); color:#fff; border:0; border-radius:10px; padding:11px; font-weight:700; cursor:pointer;}
.og-panel .og-go:hover{background:#0a4c54;} .og-panel .og-go:disabled{opacity:.6; cursor:default;}
.og-panel .og-cancel{background:#fff; color:var(--og-ink); border:1px solid var(--og-line); border-radius:10px; padding:11px 18px; font-weight:700; cursor:pointer;}
.og-panel .og-done{text-align:center; padding:14px 4px;}
.og-panel .og-done .og-tick{width:52px; height:52px; border-radius:50%; background:var(--og-tint); color:var(--og-green); display:grid; place-items:center; margin:0 auto 12px; font-size:1.6rem; font-weight:800;}
.og-panel .og-done a{color:var(--og-petrol); font-weight:700;}

/* Send to OneGIG review: every element the draft carries, in article order,
   English and Arabic side by side; empty sides and switched-off blocks are
   marked so the sender sees the full picture before creating the draft. */
.og-panel .og-static{border:1px solid var(--og-line); border-radius:9px; padding:9px 11px; font-size:.9rem; background:#f6f8f8; color:var(--og-muted);}
.og-panel .og-rv{margin-top:18px; border:1px solid var(--og-line); border-radius:12px; padding:14px 16px 6px; background:#fbfcfc;}
.og-panel .og-rv-head h3{margin:0 0 2px; font-size:.98rem; color:var(--og-petrol);}
.og-panel .og-rv-head .og-phint{margin-bottom:10px;}
.og-panel .og-rv-block{padding:10px 0; border-top:1px solid var(--og-line);}
.og-panel .og-rv-label{font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--og-petrol); margin-bottom:6px; display:flex; align-items:center; gap:8px;}
.og-panel .og-rv-state{font-size:.68rem; font-weight:700; text-transform:none; letter-spacing:0; background:var(--og-tint, #eef8ea); color:var(--og-green, #48822A); border-radius:999px; padding:2px 8px;}
.og-panel .og-rv-sub{font-size:.72rem; font-weight:700; color:var(--og-muted); margin:8px 0 4px;}
.og-panel .og-rv-pair{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:6px;}
.og-panel .og-rv-cell{font-size:.84rem; line-height:1.5; color:var(--og-ink); background:#fff; border:1px solid var(--og-line); border-radius:8px; padding:7px 10px; overflow-wrap:anywhere;}
.og-panel .og-rv-cell[dir="rtl"]{text-align:right; font-family:var(--og-font-ar, var(--og-font));}
.og-panel .og-rv-empty{color:#9a3412; background:#fff7ed; border-color:#fed7aa; font-style:italic;}
.og-panel .og-rv-title .og-rv-cell{font-weight:700;}
.og-panel .og-rv-item .og-rv-cell{position:relative; padding-inline-start:22px;}
.og-panel .og-rv-item .og-rv-cell::before{content:""; position:absolute; top:13px; inset-inline-start:9px; width:6px; height:6px; border-radius:50%; background:var(--og-green, #48822A);}
.og-panel .og-rv-sec + .og-rv-sec{margin-top:8px;}
.og-panel .og-rv-cover{display:flex; gap:12px; align-items:flex-start;}
.og-panel .og-rv-cover img{width:150px; max-height:210px; object-fit:cover; object-position:top; border:1px solid var(--og-line); border-radius:8px; background:#fff;}
.og-panel .og-rv-cover .og-phint{margin:0;}
.og-panel .og-rv-url{font-size:.76rem; color:var(--og-muted); overflow-wrap:anywhere; margin-top:2px;}
.og-panel .og-rv-warn{margin:8px 0 6px; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; border-radius:9px; padding:10px 12px; font-size:.8rem;}
.og-panel .og-rv-warn .og-rv-label{color:#9a3412; margin-bottom:4px;}
.og-panel .og-rv-warn ul{margin:0; padding-inline-start:18px; line-height:1.5;}
.og-panel .og-plain{margin-top:14px; border:1px solid var(--og-line); border-radius:9px; padding:8px 12px;}
.og-panel .og-plain summary{cursor:pointer; font-size:.8rem; font-weight:700; color:var(--og-muted);}
.og-panel .og-plain textarea{min-height:110px; font-size:.8rem;}
@media (max-width:600px){ .og-panel .og-rv-pair{grid-template-columns:1fr;} }

/* The Send to OneGIG trigger button, when the frame injects its own. */
.og-send-btn{background:var(--og-petrol); color:#fff; border:0; border-radius:9px; padding:9px 14px; font-weight:700; font-size:.86rem; cursor:pointer; font-family:var(--og-font);}
.og-send-btn:hover{background:#0a4c54;}
.og-hidden{display:none !important;}

html[dir="rtl"] .og-card .og-lang{inset-inline-end:auto; inset-inline-start:22px;}
@media (max-width:600px){ .og-panel .og-two{grid-template-columns:1fr;} .og-header{flex-wrap:wrap;} }
@media (prefers-reduced-motion: reduce){ *{transition:none !important;} }

/* Self-service account flows on the sign-in card (2026-08-31): the links
   under the form, and the green confirmation note for sent codes. */
.og-card .og-authlink{background:none; border:0; padding:0; color:var(--og-gig, #48822A); font:inherit; font-size:.8rem; text-decoration:underline; cursor:pointer;}
.og-card .og-authlinks{text-align:center; margin-top:12px; color:var(--og-muted); font-size:.8rem;}
.og-card .og-okmsg{display:none; background:#eef8ea; color:#2c5c1e; border-radius:8px; padding:9px 11px; font-size:.82rem; margin-top:12px; text-align:center;}
.og-card .og-okmsg.show{display:block;}
/* The auth modes hide fields with the hidden attribute; the label/input
   display rules above must not override it. */
.og-card label[hidden], .og-card input[hidden], .og-card select[hidden]{display:none !important;}