
/* Vira Teacher — reference UI extensions: students, attendance and Bazaar plan */
.vira-native .studio-nav{margin-top:20px!important;margin-bottom:8px!important}
.vira-native .studio-menu-circle{transform:translateY(4px)}
.vira-native .studio-drawer{top:max(16px,env(safe-area-inset-top,0px));bottom:12px;max-height:calc(100dvh - 28px);overflow-y:auto}
.v-page{padding:0 0 45px;direction:rtl;font-family:Vazirmatn,Tahoma,sans-serif}
.v-hero{background:linear-gradient(120deg,#fff8e4,#fff2ce 52%,#dff6ff);border-radius:28px;min-height:185px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;border:2px solid white;box-shadow:0 8px 25px #34678917;margin-bottom:20px}
.v-hero>div:first-child{position:relative;z-index:2;padding:21px 17px;max-width:69%}
.v-hero h1{font-size:24px;color:#133f62;margin:8px 0 7px;font-weight:950;line-height:1.5}
.v-hero p{color:#76899a;margin:0;font-size:12px;line-height:1.8}
.v-hero span{font-size:12px;color:#7793a3}
.v-hero-art.entry-story-illustration{position:relative;width:43%;min-width:105px;align-self:stretch;inset:auto;background-size:cover;background-position:center}
.v-panel{border-radius:28px;padding:19px 17px;margin-bottom:17px;background:white;box-shadow:0 9px 27px #35668b14;border:1px solid #e9eff5}
.v-panel.v-sky{background:linear-gradient(125deg,#f9fcff,#e2f7ff)}
.v-panel.v-gold{background:linear-gradient(140deg,#fffcf1,#fff0c6)}
.v-panel h2{font-weight:950;font-size:18px;display:flex;align-items:center;gap:10px;color:#144968;margin:0 0 16px}
.v-ico{width:42px;height:42px;border-radius:15px;background:#e5fcf4;color:#0c9e96;display:grid;place-items:center}
.v-gold .v-ico{background:#ffe1a5;color:#d18b21}
.v-muted{color:#748ba0;font-size:13px;line-height:2;margin:6px 0 14px}
.v-cta{min-height:50px;border:none;border-radius:17px;padding:12px 15px;font-size:14px;font-weight:900;color:#234058;cursor:pointer;box-shadow:0 4px 0 #8eabb539;display:block;width:100%;margin:12px 0}
.v-cta.v-gold{background:linear-gradient(105deg,#ffe7a3,#ffcd68)}
.v-cta.v-teal{background:linear-gradient(105deg,#26beae,#0a928a);color:white}
.v-cta.v-light{background:white;border:1px solid #dbe8f0;color:#31536d}
.v-student{display:flex;align-items:center;gap:11px;border:1px solid #e4eef5;border-radius:19px;padding:12px 10px;margin:9px 0;background:#fff;min-width:0}
.v-avatar{height:43px;width:43px;border-radius:50%;background:#e8f8ff;color:#199da9;display:grid;place-items:center;flex-shrink:0}
.v-student-text{display:grid;gap:5px;min-width:0;flex:1}
.v-student-text strong{color:#1a4560;font-size:14px}
.v-student-text small{font-size:11px;color:#67849d;overflow-wrap:anywhere}
.v-tools{display:flex;gap:4px;align-items:center;flex-shrink:0}
.v-tools button{border:1px solid #e0eaf2;border-radius:11px;padding:8px;color:#246b82;background:#eff9ff}
.v-tools button.red{color:#b7425b;background:#fff1f4}
.v-form{padding:15px;background:#fff8e9;border:1px dashed #edbf6e;border-radius:20px;margin-top:13px}
.v-form h3{font-size:17px;font-weight:900;color:#1d4861;margin:0 0 12px}
.v-input{display:block;margin:12px 0;color:#244866;font-weight:800;font-size:13px}
.v-input span{display:block;margin-bottom:7px}
.v-input input{width:100%;height:48px;display:block;background:white;border:1px solid #d9e5f0;border-radius:13px;padding:9px 12px;color:#173e5f;direction:rtl;min-width:0}
.v-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.v-empty{padding:19px 8px;border:1px dashed #d6e5ef;border-radius:17px;text-align:center;color:#8399a8;font-size:13px}
.v-month{display:flex;align-items:center;justify-content:space-between;gap:5px;margin:9px 0 15px}
.v-month .v-cta{width:auto;min-height:39px;margin:0;padding:8px 10px;font-size:11px}
.v-month strong{font-size:13px;color:#204c67;white-space:nowrap}
.v-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;direction:rtl}
.v-calendar>b{display:grid;place-items:center;color:#47718f;padding:8px 0;font-size:12px}
.v-day{aspect-ratio:1/1;width:100%;border:1px solid #e1ebf2;background:white;border-radius:11px;font-size:12px;font-weight:850;color:#28516b;display:grid;place-items:center}
.v-day.complete{background:#baf0d1;border-color:#a5ddbe}
.v-day.partial{background:#ffe1a1;border-color:#f5ca83}
.v-day.active{box-shadow:inset 0 0 0 2px #149faf;background:#d5f2ff}
.v-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.v-summary>div{padding:14px 11px;border-radius:15px;background:#ffffffac;min-width:0}
.v-summary strong{font-size:13px;color:#275a70}
.v-summary p{font-size:12px;color:#6b8397;overflow-wrap:anywhere;line-height:2;margin:6px 0 0}
.v-att-row{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#f7fbff;border-radius:15px;padding:10px;margin:8px 0}
.v-att-row strong{font-size:13px;color:#22506a}
.v-att-row select{max-width:145px;min-width:0;border:1px solid #daebf1;border-radius:11px;background:white;color:#245270;font-size:12px;padding:8px}
.v-stat{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:17px 0}
.v-stat>div{display:grid;text-align:center;gap:8px;border-radius:16px;background:white;padding:15px}
.v-stat b{font-size:22px;color:#0a9799}
.v-stat span{color:#7a91a0;font-size:12px}
.v-success{padding:15px;text-align:center;border-radius:15px;background:#dff9e7;color:#108562}
@media(max-width:355px){.v-panel{padding:12px 10px}.v-hero h1{font-size:19px}.v-calendar{gap:2px}.v-student .v-avatar{display:none}}

/* v2.2: seamless blue status area and lower menu button */
html.vira-native,html.vira-native body{background:#eaf7ff!important}
.vira-native .studio-shell,.vira-native .studio-nav{background-color:#eaf7ff!important}
.vira-native .studio-nav{margin-top:30px!important;padding-top:8px!important;margin-bottom:8px!important}
.vira-native .studio-menu-circle{transform:translateY(6px)!important}
.v-price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 18px}
.v-price-card{border-radius:24px;padding:18px 13px;border:1px solid #ece7eb;background:linear-gradient(155deg,#eafcf1,#fff);box-shadow:0 9px 23px #385a8318}
.v-price-professional{background:linear-gradient(150deg,#e3f7ff,#f5ebff)}
.v-price-gold{background:linear-gradient(150deg,#fff1c4,#ffe6b4);border-color:#f4d184}
.v-plan-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.v-plan-header small{font-size:11px;color:#668495}
.v-plan-header h3{margin:4px 0 0;font-size:17px;color:#163d61}
.v-plan-icon{display:grid;place-items:center;background:#fff9;border-radius:14px;padding:9px;color:#1b999d}
.v-price-gold .v-plan-icon{color:#d39221}
.v-price{margin:13px 0;color:#264f6b;font-size:12px}
.v-price strong{font-size:24px;white-space:nowrap}
.v-price small{color:#7a869d}
.v-plan-feature{padding:11px 0;border-top:1px solid #d5e4e9;font-size:13px;color:#355773}
.v-plan-feature b{color:#154b63;font-size:14px}
.v-plan-buy{background:#159c97;border:0;color:white;width:100%;min-height:48px;border-radius:14px;font-weight:850;font-size:13px;margin-top:15px}
.v-price-gold .v-plan-buy{background:#df982f}
.v-plan-buy:disabled{opacity:.55;cursor:not-allowed}
.v-service-notice{border-radius:16px;padding:13px;background:#fff5dd;color:#8c6324;line-height:2;margin-bottom:14px;font-size:12px}
.v-user-line{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;background:#ffffffbd;padding:14px;border-radius:14px;color:#1d5369}
.v-user-line strong{overflow-wrap:anywhere}
.v-inline-form .v-input{margin-top:0}
.v-wallet-balance{font-size:29px;font-weight:950;color:#179a95;margin:13px 0}
.v-wallet-balance small{font-size:14px;color:#63889a}
.v-ref-line{display:flex;align-items:center;gap:8px;background:white;padding:9px;border:1px solid #dbe6ee;border-radius:13px;min-width:0}
.v-ref-line code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;color:#174c65}
.v-ref-line button{border:0;border-radius:10px;background:#e4f2ff;color:#155c79;padding:10px;font-weight:900;white-space:nowrap}
.v-ref-line button:disabled{opacity:.45}
.v-commercial-footnote{font-size:11px;color:#65818f;line-height:2;padding:6px 11px 20px}
@media(max-width:720px){.v-price-grid{grid-template-columns:1fr;gap:13px}.v-price-card{padding:19px}.v-price strong{font-size:27px}}


/* v2.3 — student learning portfolio in the approved pastel design */
.v-folder-button{color:#0f8d80!important;background:#def8ee!important;border-color:#beeade!important}
.v-input textarea,.v-input select{width:100%;display:block;background:white;border:1px solid #d9e5f0;border-radius:13px;padding:11px 12px;color:#173e5f;direction:rtl;min-width:0}
.v-input textarea{resize:vertical;line-height:1.95;min-height:96px}
.v-input select{min-height:49px}
.v-portfolio-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:8px 0 18px}
.v-portfolio-stats>div{padding:17px 6px;background:#fff;border:1px solid #e8edf4;box-shadow:0 6px 18px #34678912;border-radius:18px;text-align:center;display:grid;gap:6px}
.v-portfolio-stats b{font-size:24px;color:#149f94}
.v-portfolio-stats small{font-size:11px;color:#638294}
.v-assessment-card{border:1px solid #e2ebf3;background:linear-gradient(155deg,#fff,#f7fbff);border-radius:20px;padding:16px 14px;margin:12px 0;overflow-wrap:anywhere}
.v-assessment-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.v-assessment-head strong{font-size:15px;color:#234b69}
.v-level{font-size:11px;padding:6px 9px;border-radius:99px;font-weight:800;background:#eff3f7;color:#5b6b7b}
.v-level.excellent{background:#d6f7de;color:#218346}
.v-level.good{background:#d7f4f1;color:#0b8780}
.v-level.developing{background:#fff0c7;color:#a07315}
.v-level.support{background:#ffe2e7;color:#a63e55}
.v-assessment-date{font-size:12px!important;color:#718ca0!important}
.v-assessment-card p{font-size:13px;line-height:1.95;color:#375a73;margin:10px 0}
.v-assessment-tools{display:flex;gap:9px;margin-top:14px}
.v-assessment-tools button{border:1px solid #cfe5ef;background:#e5f7ff;color:#175e7b;border-radius:11px;padding:8px 15px;font-size:12px;font-weight:800}
.v-assessment-tools .danger{border-color:#ffe0e6;background:#fff2f5;color:#b44a64}
.v-overview-item{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:13px 7px;border-bottom:1px solid #e3edf5}
.v-overview-item strong{color:#244a65;font-size:13px}
.v-overview-item span{font-size:12px;color:#5d8199}
@media(max-width:390px){.v-portfolio-stats{gap:5px}.v-portfolio-stats b{font-size:20px}.v-portfolio-stats small{font-size:10px}.v-student{gap:6px}.v-tools button{padding:6px}}

/* v2.3 classroom helpers */
.v-picker-result{background:linear-gradient(135deg,#e7e1ff,#c5f6f0);border:2px dashed #85b4ce;border-radius:21px;padding:25px 12px;text-align:center;font-size:23px;font-weight:950;color:#235e79;margin:12px 0}
.v-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:15px 0}
.v-group-card{padding:14px;border-radius:18px;border:1px solid #e8e5f2;background:#fffdfd;min-width:0}
.v-group-card strong{color:#7053bb}.v-group-card p{font-size:13px;color:#375b6f;line-height:2;overflow-wrap:anywhere}
@media(max-width:420px){.v-group-grid{grid-template-columns:1fr}}
