/*
 * Yourcloudweb Experience 1.1.0
 * Independent final design layer. Existing WHMCS controls, IDs and
 * component JavaScript are deliberately preserved.
 */
:root {
  --ycw-primary: #ff5900;
  --ycw-primary-dark: #dd4c00;
  --ycw-primary-soft: #fff1e7;
  --ycw-ink: #152443;
  --ycw-muted: #728097;
  --ycw-line: #e7edf5;
  --ycw-bg: #f5f8fc;
  --ycw-card: #fff;
  --ycw-radius: 18px;
  --ycw-shadow: 0 8px 30px rgba(25,43,77,.045);
  --ycw-shadow-hover: 0 16px 34px rgba(25,43,77,.105);
  --ycw-sidebar: 272px;
}
body.ycw-portal { background: var(--ycw-bg) !important; color: var(--ycw-ink); }
body.ycw-portal :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(255,89,0,.7) !important; outline-offset: 3px;
}
body.ycw-portal :where(a, button) { -webkit-tap-highlight-color: transparent; }
body.ycw-portal :where(img, svg) { max-width: 100%; }
body.ycw-portal :where(.panel, .table-container, .list-group, .well, .card) { border-color: var(--ycw-line); }
body.ycw-portal .wdes-content, body.ycw-portal .whm-sidebar { background: var(--ycw-bg) !important; }
body.ycw-portal .wdes-sidebar { border-color: var(--ycw-line) !important; }
body.ycw-portal .wdes-sidebar .ycw-brand { min-height: 88px; }
body.ycw-portal .wdes-sidebar .ycw-sidebar-label { letter-spacing: .10em; }
body.ycw-portal .wdes-sidebar .ycw-help-card { background: #fff8f3; border-color: #ffe1cd; border-radius: 16px; }
body.ycw-portal #header .container { min-height: 66px; }
body.ycw-portal #main-body .main-content { min-width: 0; }
body.ycw-portal .whm-sidebar .panel-sidebar { border: 1px solid var(--ycw-line) !important; }
body.ycw-portal .table-container { max-width: 100%; }
body.ycw-portal .header-lined h1,
body.ycw-portal .page-header h1 { font-size: clamp(22px,2.15vw,31px) !important; line-height: 1.25; }
body.ycw-portal .main-content > .alert { border-radius: 13px !important; padding: 15px 17px !important; }
body.ycw-portal :where(.panel, .well, .table-container) { box-shadow: var(--ycw-shadow); }
body.ycw-portal .panel-heading { background: #fff; }
body.ycw-portal .panel-title { font-size: 14px; font-weight: 700; }
body.ycw-portal .panel-body { line-height: 1.7; }
body.ycw-portal .btn-primary,
body.ycw-portal .btn-success:not(.btn-outline),
body.ycw-portal .btn-info:not(.btn-outline) { background: var(--ycw-primary) !important; border-color: var(--ycw-primary) !important; }
body.ycw-portal .btn-primary:hover,
body.ycw-portal .btn-success:not(.btn-outline):hover,
body.ycw-portal .btn-info:not(.btn-outline):hover { background: var(--ycw-primary-dark) !important; border-color: var(--ycw-primary-dark) !important; }
body.ycw-portal .form-control:focus { border-color: #ffab7c !important; box-shadow: 0 0 0 3px rgba(255,89,0,.10) !important; }
body.ycw-portal .dataTables_wrapper .dataTables_filter input { max-width: 100%; }
body.ycw-portal .table > thead > tr > th { background: #f7f9fd; color: #67758d !important; letter-spacing: .025em; }
body.ycw-portal .table > tbody > tr:hover { background: #fffaf7; }
body.ycw-portal .table > tbody > tr > td { vertical-align: middle; }
body.ycw-portal .table .status,
body.ycw-portal .table .label { display: inline-block; padding: 7px 10px; border-radius: 9px; font-size: 11px; font-weight: 700; }
body.ycw-portal .pagination > .active > a { background: #ff5900; border-color: #ff5900; color: #fff; }
body.ycw-portal .nav-tabs > li.active > a { border-bottom: 2px solid #ff5900 !important; }
body.ycw-portal .list-group-item { transition: color .16s ease,background-color .16s ease; }
body.ycw-portal .list-group-item:hover { background: #fff7f2; }
body.ycw-portal :where(.btn, .form-control, .nav-tabs > li > a) { transition: border-color .2s ease,background-color .2s ease,color .2s ease,box-shadow .2s ease; }

/* Discover: homepage */
body.ycw-portal.template-homepage #main-body { padding-top: 28px !important; }
body.ycw-portal.template-homepage .main-content { width: 100%; }
.ycw-discover { width: 100%; max-width: 1500px; margin: 0 auto 70px; }
.ycw-discover * { box-sizing: border-box; }
.ycw-discover h1, .ycw-discover h2, .ycw-discover h3, .ycw-discover p { margin-top: 0; }
.ycw-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; line-height: 1.4; letter-spacing: .1em; text-transform: uppercase; font-weight: 800; color: #e7570d; }
.ycw-discover-hero { position: relative; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(255px,.85fr); align-items: center; gap: 24px; min-height: 355px; padding: clamp(25px,4vw,58px); border: 1px solid #e8edf5; border-radius: 25px; background: radial-gradient(circle at 87% 23%,#ffecdf 0,transparent 37%),linear-gradient(120deg,#fff 0%,#fff 70%,#fff9f4 100%); box-shadow: var(--ycw-shadow); overflow: hidden; }
.ycw-discover-hero::before { content: ''; position: absolute; height: 5px; width: 76px; top: 0; left: 54px; background: var(--ycw-primary); border-radius: 0 0 9px 9px; }
.ycw-discover-hero-copy { position: relative; z-index: 1; }
body.ycw-portal .ycw-discover-hero h1 { max-width: 710px; margin: 14px 0 17px; font-size: clamp(31px,3.05vw,49px) !important; font-weight: 800; line-height: 1.15; letter-spacing: -.045em; }
.ycw-discover-hero h1 span { color: var(--ycw-primary); }
.ycw-discover-hero-copy > p { max-width: 650px; margin-bottom: 25px; font-size: 14px; line-height: 1.85; color: #6f7c91; }
.ycw-discover-hero-art { width: min(100%,480px); align-self: center; justify-self: center; }
.ycw-discover-hero-art img { display: block; width: 100%; height: auto; }
.ycw-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
body.ycw-portal a.ycw-action { display: inline-flex; min-height: 47px; align-items: center; justify-content: center; gap: 11px; padding: 12px 17px; border: 1px solid transparent; border-radius: 12px; font-size: 12px; font-weight: 700; line-height: 1.35; text-decoration: none !important; transition: transform .18s ease,box-shadow .18s ease,background-color .18s ease; }
body.ycw-portal a.ycw-action:hover { transform: translateY(-2px); }
body.ycw-portal a.ycw-action-primary { background: #ff5900; border-color: #ff5900; color: #fff !important; box-shadow: 0 7px 16px rgba(255,89,0,.15); }
body.ycw-portal a.ycw-action-primary:hover { background: #e04c00; border-color: #e04c00; box-shadow: 0 10px 22px rgba(255,89,0,.24); }
body.ycw-portal a.ycw-action-secondary { background: #fff; border-color: #e3e9f1; color: #263955 !important; }
body.ycw-portal a.ycw-action-secondary:hover { background: #fff8f3; border-color: #ffdfcb; }
.ycw-hero-foot { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 24px; font-size: 11px; font-weight: 600; color: #7a8595; }
.ycw-hero-foot span { display: inline-flex; align-items: center; gap: 7px; }
.ycw-hero-foot i { color: #32a776; font-size: 13px; }
.ycw-discover-section { margin-top: clamp(28px,3.5vw,45px); }
.ycw-discover-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin: 0 0 19px; }
body.ycw-portal .ycw-discover-section h2 { margin: 8px 0 5px; font-size: clamp(20px,2.2vw,28px) !important; line-height: 1.3; letter-spacing: -.03em; }
.ycw-discover-section-heading p { margin: 0; color: var(--ycw-muted); font-size: 12.5px; }
body.ycw-portal .ycw-section-action { white-space: nowrap; display: inline-flex; align-items: center; gap: 9px; color: #ff5900; font-size: 12px; font-weight: 700; padding: 8px 0; }
.ycw-discover-quick-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
body.ycw-portal a.ycw-discover-quick-card { color: #152443 !important; display: flex; flex-direction: column; min-height: 345px; position: relative; border: 1px solid #e5ecf5; background: #fff; border-radius: 21px; overflow: hidden; text-decoration: none !important; box-shadow: var(--ycw-shadow); transition: border-color .2s ease,transform .2s ease,box-shadow .2s ease; }
body.ycw-portal a.ycw-discover-quick-card:hover { transform: translateY(-4px); box-shadow: var(--ycw-shadow-hover); border-color: #ffd2b9; }
.ycw-quick-art { display: flex; align-items: center; justify-content: center; height: 159px; background: #fff5ef; }
.ycw-quick-hosting .ycw-quick-art { background: #edf5ff; }
.ycw-quick-manage .ycw-quick-art { background: #eefaf3; }
.ycw-quick-art img { display: block; height: 152px; width: min(100%,240px); object-fit: contain; }
.ycw-quick-text { display: flex; flex-direction: column; flex: 1 1 auto; padding: 22px 24px 24px; }
.ycw-card-kicker { display: block; margin-bottom: 8px; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #f36a27; }
.ycw-quick-hosting .ycw-card-kicker { color: #3b79db; }
.ycw-quick-manage .ycw-card-kicker { color: #2a9970; }
body.ycw-portal .ycw-quick-text h3 { margin: 0 0 7px; font-size: clamp(15px,1.4vw,18px) !important; line-height: 1.4; }
.ycw-quick-text p { margin: 0 0 19px; color: #788397; font-size: 12px; line-height: 1.7; }
body.ycw-portal .ycw-quick-link { display: inline-flex; align-items: center; gap: 9px; margin-top: auto; font-size: 11.5px; font-weight: 800; color: #ff5900; }
.ycw-discover-products { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
body.ycw-portal a.ycw-discover-product { display: flex; align-items: center; gap: 15px; min-width: 0; min-height: 116px; padding: 20px; background: #fff; border: 1px solid var(--ycw-line); border-radius: 17px; box-shadow: var(--ycw-shadow); text-decoration: none !important; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
body.ycw-portal a.ycw-discover-product:hover { transform: translateY(-3px); border-color: #ffcdb2; box-shadow: var(--ycw-shadow-hover); }
.ycw-product-icon { display: inline-flex; flex: 0 0 56px; align-items: center; justify-content: center; height: 56px; width: 56px; border-radius: 16px; background: #fff0e5; color: #ff5900; font-size: 23px; }
.ycw-product-cloud .ycw-product-icon,.ycw-product-hosting .ycw-product-icon { background: #eaf2ff; color: #3f7fe5; }
.ycw-product-microsoft .ycw-product-icon { background: #edf2ff; color: #3776df; }
.ycw-product-security .ycw-product-icon,.ycw-product-connectivity .ycw-product-icon { background: #eaf9f1; color: #2ca477; }
.ycw-product-voice .ycw-product-icon,.ycw-product-mail .ycw-product-icon { background: #f5eeff; color: #9662cb; }
.ycw-product-content { display: flex; flex-direction: column; min-width: 0; gap: 6px; flex: 1 1 auto; }
.ycw-product-content strong { color: #1a2945; line-height: 1.4; font-size: 13.5px; overflow-wrap: anywhere; }
.ycw-product-content > span { font-size: 11px; line-height: 1.55; color: var(--ycw-muted); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.ycw-product-arrow { font-size: 13px; color: #ff5900; }
body.ycw-portal .ycw-discover-all-products { display: flex; align-items: center; min-height: 114px; gap: 19px; background: #fff; border: 1px solid var(--ycw-line); padding: 20px; border-radius: 18px; box-shadow: var(--ycw-shadow); }
.ycw-discover-all-products strong { flex: 1; color: #1a2945; }
.ycw-discover-help { display: flex; align-items: center; gap: clamp(15px,3vw,30px); margin-top: 45px; padding: 20px 30px; border-radius: 22px; border: 1px solid #ffdfc9; background: linear-gradient(105deg,#fff5ed,#fff 85%); }
.ycw-help-illustration { width: 132px; flex: 0 0 132px; }
.ycw-help-illustration img { display: block; width: 100%; }
.ycw-help-content { flex: 1; min-width: 0; }
body.ycw-portal .ycw-help-content h2 { font-size: clamp(18px,1.8vw,25px) !important; margin: 7px 0 8px; }
.ycw-help-content p { font-size: 12px; color: var(--ycw-muted); max-width: 580px; margin: 0; line-height: 1.75; }
.ycw-discover-help > .ycw-action { flex: 0 0 auto; }
.ycw-news-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.ycw-news-card { display: flex; flex-direction: column; padding: 23px; border: 1px solid var(--ycw-line); background: #fff; border-radius: 18px; box-shadow: var(--ycw-shadow); }
.ycw-news-icon { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 11px; background: #fff1e7; color: #ff5900; font-size: 17px; margin-bottom: 16px; }
.ycw-news-date { color: var(--ycw-muted); font-size: 11px; }
body.ycw-portal .ycw-news-card h3 { margin: 8px 0 9px; font-size: 15px !important; line-height: 1.5; }
body.ycw-portal .ycw-news-card h3 a { color: #192846; }
.ycw-news-card p { font-size: 11.5px; line-height: 1.8; color: var(--ycw-muted); overflow-wrap: anywhere; flex: 1 1 auto; }
body.ycw-portal .ycw-news-more { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 800; }

/* Dashboard enhancement */
body.ycw-portal .ycw-dashboard-hero { min-height: 186px; }
body.ycw-portal .ycw-dashboard-hero .ycw-dashboard-head { position: relative; z-index: 1; }
body.ycw-portal .ycw-dashboard-hero .ycw-dashboard-copy { max-width: calc(100% - 185px); }
.ycw-dashboard-hero-image { pointer-events: none; position: absolute; top: -11px; right: 5px; width: 215px; max-width: 30%; opacity: .9; }
.ycw-dashboard-services { margin: 7px 0 28px; }
.ycw-dashboard-action-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
body.ycw-portal a.ycw-dashboard-action-card { display: flex; align-items: center; gap: 13px; min-width: 0; padding: 18px; min-height: 104px; border: 1px solid var(--ycw-line); border-radius: 17px; background: #fff; box-shadow: var(--ycw-shadow); text-decoration: none !important; transition: transform .18s ease,border-color .18s ease; }
body.ycw-portal a.ycw-dashboard-action-card:hover { transform: translateY(-2px); border-color: #ffcbab; }
.ycw-dashboard-action-icon { display: inline-flex; flex: 0 0 50px; align-items: center; justify-content: center; height: 50px; border-radius: 14px; font-size: 22px; }
.ycw-dashboard-action-icon--orange { background: #fff0e5; color: #ff5900; }
.ycw-dashboard-action-icon--blue { background: #eaf3ff; color: #3b78dc; }
.ycw-dashboard-action-icon--green { background: #e7f8ef; color: #289c71; }
.ycw-dashboard-action-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 5px; }
.ycw-dashboard-action-copy strong { color: #182744; font-size: 12px; line-height: 1.4; }
.ycw-dashboard-action-copy small { color: #718097; font-size: 10.5px; line-height: 1.5; }
.ycw-dashboard-action-arrow { color: #ff5900; font-size: 12px; }
body.ycw-portal .ycw-dashboard .tile { transition: transform .18s ease,box-shadow .18s ease; }
body.ycw-portal .ycw-dashboard .tile:hover { transform: translateY(-3px); box-shadow: var(--ycw-shadow-hover) !important; }
body.ycw-portal .ycw-dashboard .tile a:focus-visible { outline-offset: -5px !important; }

/* Responsive: exact control over cards, shell and forms */
@media (max-width: 1450px) {
  .ycw-discover-quick-grid { gap: 14px; }
  .ycw-discover-products { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ycw-dashboard-action-grid { gap: 12px; }
}
@media (max-width: 1230px) {
  .ycw-dashboard-action-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ycw-discover-help { flex-wrap: wrap; }
  .ycw-discover-help > .ycw-action { margin-left: auto; }
}
@media (max-width: 1050px) {
  body.ycw-portal.template-homepage #main-body { padding-top: 22px !important; }
  .ycw-discover-hero { min-height: 310px; }
  .ycw-dashboard-hero-image { opacity: .6; }
}
@media (max-width: 820px) {
  .ycw-discover-hero { grid-template-columns: 1fr 230px; padding: 25px; gap: 0; }
  .ycw-discover-hero-copy > p { font-size: 12px; }
  body.ycw-portal .ycw-discover-hero h1 { font-size: 30px !important; }
  .ycw-discover-quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ycw-discover-help { padding: 20px; }
  .ycw-news-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ycw-dashboard-hero-image { display: none; }
  body.ycw-portal .ycw-dashboard-hero .ycw-dashboard-copy { max-width: none; }
}
@media (max-width: 620px) {
  body.ycw-portal.template-homepage #main-body { padding-top: 12px !important; }
  .ycw-discover { margin-bottom: 42px; }
  .ycw-discover-hero { grid-template-columns: 1fr; padding: 28px 20px 16px; min-height: 0; border-radius: 19px; }
  .ycw-discover-hero::before { left: 22px; }
  .ycw-discover-hero-art { margin-top: 10px; max-width: 240px; }
  .ycw-discover-hero-copy > p { margin-bottom: 18px; }
  body.ycw-portal .ycw-discover-hero h1 { font-size: clamp(26px,7.8vw,34px) !important; }
  .ycw-hero-actions .ycw-action { flex: 1 1 100%; }
  .ycw-hero-foot { margin-top: 18px; gap: 6px 13px; }
  .ycw-discover-section { margin-top: 29px; }
  .ycw-discover-section-heading { align-items: flex-start; flex-direction: column; }
  .ycw-discover-quick-grid,.ycw-discover-products,.ycw-news-grid,.ycw-dashboard-action-grid { grid-template-columns: 1fr; }
  body.ycw-portal a.ycw-discover-quick-card { min-height: 0; }
  .ycw-quick-art { height: 140px; }
  .ycw-quick-art img { height: 140px; }
  .ycw-quick-text { padding: 20px; }
  .ycw-discover-help { align-items: flex-start; gap: 6px; }
  .ycw-help-illustration { flex: 0 0 84px; width: 84px; }
  .ycw-help-content { flex: 1 1 calc(100% - 100px); }
  .ycw-discover-help > .ycw-action { width: 100%; margin-top: 12px; }
  body.ycw-portal .table > thead > tr > th,body.ycw-portal .table > tbody > tr > td { padding: 11px 9px !important; }
  .ycw-dashboard-action-grid { gap: 10px; }
  body.ycw-portal a.ycw-dashboard-action-card { min-height: 91px; }
}
@media (max-width: 385px) {
  .ycw-hero-foot { flex-direction: column; }
  .ycw-product-icon { width: 47px; height: 47px; flex-basis: 47px; }
  body.ycw-portal a.ycw-discover-product { padding: 14px; gap: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .ycw-discover a,.ycw-dashboard a { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .ycw-discover a:hover,.ycw-dashboard a:hover { transform: none !important; }
}
@media print {
  .ycw-discover-hero-art,.ycw-dashboard-hero-image { display: none; }
  .ycw-discover-hero,.ycw-discover-quick-card,.ycw-discover-product { box-shadow: none !important; }
}
