/* ============================================================ modern-front.css — Public site SaaS skin (NAVY + ORANGE) Appended LAST in ; overrides style.css + online-course.css by cascade only. No existing public CSS file is modified. Brand: navy #002147 + orange #f58001 (matches the admin theme). ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap'); :root{ --f-navy:#002147; --f-navy-600:#0b4a8f; --f-navy-050:#eef4fa; --f-orange:#f58001; --f-orange-600:#db7000; --f-ink:#0f1f33; --f-muted:#5b6b7f; --f-bg:#f4f7fb; --f-surface:#ffffff; --f-border:#e3e9f0; --f-radius:14px; --f-shadow:0 6px 24px -12px rgba(0,33,71,.18); --f-ease:cubic-bezier(.22,1,.36,1); } /* ---------- Typography: Roboto -> Cairo ---------- */ body, p, span, div, a, li, td, th, input, select, textarea, button, .proinner, .product-item, .price, .pricesell, .secsubtitle, .breadcrumb{ font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif !important; } h1,h2,h3,h4,h5,h6, .sectitle, .slide-text, .proinner h5{ font-family:'Cairo','Segoe UI',sans-serif !important; font-weight:700 !important; } body{ color:var(--f-ink); -webkit-font-smoothing:antialiased; } /* ---------- Links -> navy / orange hover ---------- */ a{ color:var(--f-navy-600); transition:color .2s var(--f-ease); } a:hover, a:focus{ color:var(--f-orange); } /* ---------- Buttons: navy primary, orange CTA, modern radius ---------- */ .btn{ border-radius:10px !important; font-weight:600 !important; transition:all .2s var(--f-ease) !important; } .btn-primary, .slide-text > a.btn-primary{ background:var(--f-navy) !important; border-color:var(--f-navy) !important; color:#fff !important; } .btn-primary:hover, .btn-primary:focus, .slide-text > a.btn-primary:hover{ background:var(--f-navy-600) !important; border-color:var(--f-navy-600) !important; color:#fff !important; } .ptaddtocart, .gotocartbtn, .btn-success, .addtocartbtn{ background:var(--f-orange) !important; border-color:var(--f-orange) !important; color:#fff !important; border-radius:10px !important; } .ptaddtocart:hover, .gotocartbtn:hover, .btn-success:hover{ background:var(--f-orange-600) !important; border-color:var(--f-orange-600) !important; color:#fff !important; } /* ---------- Remove legacy green / blue / maroon accents ---------- */ .product-item:hover .pricesell, .product-item:hover .proinner h5{ color:var(--f-orange) !important; } .pricesell, .price, .current-pricetext{ color:var(--f-navy) !important; font-weight:700; } .proinner .authers a:hover{ color:var(--f-navy-600) !important; } .newsinner{ background:var(--f-navy) !important; border-radius:12px; } .newspagebox2 a, .newspagebox2 .date2, .date_item, .datenews, .newscontent ul li span{ color:var(--f-navy-600) !important; } /* ---------- Course / product cards -> modern SaaS ---------- */ .product-item{ border-radius:var(--f-radius) !important; border:1px solid var(--f-border) !important; box-shadow:var(--f-shadow) !important; overflow:hidden; transition:transform .2s var(--f-ease), box-shadow .2s var(--f-ease) !important; } .product-item:hover{ transform:translateY(-4px); box-shadow:0 16px 38px -14px rgba(0,33,71,.30) !important; } .coursebox, .panel, .card{ border-radius:var(--f-radius) !important; box-shadow:var(--f-shadow) !important; border:1px solid var(--f-border) !important; } .coupon-tag{ background:var(--f-orange-600) !important; } /* ---------- Forms ---------- */ .form-control, .priceinput{ border-radius:10px !important; border:1px solid var(--f-border) !important; box-shadow:none !important; } .form-control:focus{ border-color:var(--f-navy-600) !important; box-shadow:0 0 0 3px rgba(0,33,71,.12) !important; } /* ---------- Motion: kill the legacy 1s transitions ---------- */ a, .btn, .product-item, .product-img img, .owl-item img{ transition-duration:.2s !important; }