/* Royal Office Premium 3.0 — Global UI */
:root {
  --ro-accent: #078CFF;
  --ro-accent-dark: #0576d8;
  --ro-accent-soft: #eef7ff;
  --ro-navy: #0b2f58;
  --ro-navy-2: #092543;
  --ro-text: #17233a;
  --ro-muted: #718096;
  --ro-soft: #f7f9fc;
  --ro-line: #e5ebf2;
  --ro-white: #fff;
  --ro-success: #16a05d;
  --ro-danger: #eb445a;
  --ro-warning: #e59a18;
  --ro-radius: 14px;
  --ro-radius-sm: 10px;
  --ro-shadow-sm: 0 8px 24px rgba(18, 49, 83, .07);
  --ro-shadow: 0 18px 50px rgba(18, 49, 83, .11);
  --ro-container: 1400px;
  --ro-transition: .22s cubic-bezier(.2,.7,.2,1);
}

html { scroll-behavior: smooth; }
body {
  background: #fff !important;
  color: var(--ro-text);
  font-family: inherit;
  -webkit-font-smoothing: antialiased;
}
body, #wrapper, #content-wrapper { background-color: #fff; }
#wrapper { box-shadow: none; padding-top: 0; }
#wrapper > .container,
#header .container,
#footer .container,
.container {
  width: 100%;
  max-width: var(--ro-container);
}
@media (min-width: 1200px) {
  .container { width: var(--ro-container); }
}

/* reset visual noise from Classic */
.card,
.page-content.card,
.block-category.card,
.cart-container.card,
.cart-summary.card {
  border: 1px solid var(--ro-line);
  border-radius: var(--ro-radius);
  box-shadow: none;
  background: #fff;
}

h1,h2,h3,h4,h5,h6 { color: var(--ro-text); letter-spacing: -.02em; }
a { color: inherit; transition: color var(--ro-transition), background var(--ro-transition), border-color var(--ro-transition), opacity var(--ro-transition), transform var(--ro-transition); }
a:hover { color: var(--ro-accent); text-decoration: none; }

.btn,
button,
input,
select,
textarea { font-family: inherit; }
.btn {
  min-height: 42px;
  border-radius: 10px;
  font-weight: 700;
  letter-spacing: 0;
  box-shadow: none !important;
  transition: transform var(--ro-transition), box-shadow var(--ro-transition), background var(--ro-transition), border-color var(--ro-transition);
}
.btn:hover { transform: translateY(-1px); }
.btn-primary,
.btn-primary:focus,
.btn-primary.focus {
  background: var(--ro-accent);
  border-color: var(--ro-accent);
  color: #fff;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active {
  background: var(--ro-accent-dark);
  border-color: var(--ro-accent-dark);
}
.btn-secondary {
  color: var(--ro-text);
  background: #fff;
  border: 1px solid var(--ro-line);
}
.btn-secondary:hover { color: var(--ro-accent); border-color: #b8dcff; background: var(--ro-accent-soft); }

.form-control,
input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"],
select, textarea {
  border: 1px solid #dce4ed;
  border-radius: 10px;
  background: #fff;
  min-height: 44px;
  color: var(--ro-text);
  box-shadow: none;
}
.form-control:focus,
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #78beff;
  box-shadow: 0 0 0 3px rgba(7,140,255,.10);
}

/* page spacing */
#content-wrapper { padding-top: 0; }
#main { min-height: 300px; }
.page-header { margin: 18px 0 22px; }
.page-header h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 800; }

/* Breadcrumb: one discreet line across the entire shop */
#wrapper .breadcrumb {
  margin: 0;
  padding: 11px 0 12px;
  background: transparent;
  border: 0;
  font-size: 12px;
  line-height: 1.3;
  min-height: 38px;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
#wrapper .breadcrumb::-webkit-scrollbar { display: none; }
#wrapper .breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
#wrapper .breadcrumb li {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  color: #8693a6;
  font-weight: 500;
}
#wrapper .breadcrumb li + li::before {
  content: "\f054";
  font-family: "Font Awesome 6 Pro";
  font-weight: 400;
  font-size: 8px;
  color: #b8c1ce;
  margin: 0 9px;
}
#wrapper .breadcrumb li:first-child a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#wrapper .breadcrumb li:first-child a::before {
  content: "\f015";
  font-family: "Font Awesome 6 Pro";
  font-weight: 700;
  color: var(--ro-accent);
  font-size: 11px;
}
#wrapper .breadcrumb a { color: #607087; font-weight: 600; }
#wrapper .breadcrumb a:hover { color: var(--ro-accent); }
#wrapper .breadcrumb li:last-child { color: #8995a7; font-weight: 500; max-width: 430px; overflow: hidden; text-overflow: ellipsis; }

/* generic section heading */
.ro-section-heading {
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  margin: 0 0 22px;
}
.ro-section-heading__title { display:flex; align-items:center; gap:12px; }
.ro-section-heading__icon {
  width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
  background:var(--ro-accent-soft); color:var(--ro-accent); font-size:17px;
}
.ro-section-heading h1,.ro-section-heading h2,.ro-section-heading h3 { margin:0; font-weight:800; }
.ro-eyebrow { display:block; color:#8996a9; font-size:10px; line-height:1.2; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin-bottom:4px; }

/* alerts */
.alert { border:0; border-radius:12px; padding:14px 16px; }
.alert-success { background:#edf9f3; color:#0d7644; }
.alert-danger { background:#fff0f2; color:#bd3143; }
.alert-warning { background:#fff8e8; color:#9c6a09; }

/* tables */
.table { color: var(--ro-text); }
.table thead th { border-bottom:1px solid var(--ro-line); color:#7c899b; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.table td { border-top:1px solid #edf1f6; vertical-align:middle; }

/* global toast */
#ro-toast-stack { position:fixed; right:18px; bottom:18px; z-index:99999; display:flex; flex-direction:column; gap:10px; pointer-events:none; }
.ro-toast { display:flex; align-items:center; gap:10px; min-width:260px; max-width:390px; padding:13px 15px; border-radius:12px; background:#11233e; color:#fff; box-shadow:0 18px 50px rgba(8,28,55,.22); transform:translateY(12px); opacity:0; transition:.25s ease; }
.ro-toast.is-visible { transform:translateY(0); opacity:1; }
.ro-toast i { color:#64b9ff; }
.ro-toast strong { display:block; font-size:13px; }
.ro-toast span { display:block; font-size:11px; color:#c9d4e3; margin-top:2px; }

/* skeleton/interactive utility */
.ro-loading { position:relative; pointer-events:none; opacity:.72; }
.ro-loading::after { content:""; position:absolute; width:16px; height:16px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; animation:roSpin .7s linear infinite; }
@keyframes roSpin { to { transform:rotate(360deg); } }

@media (max-width: 767.98px) {
  #wrapper .breadcrumb { padding:9px 0 10px; font-size:11px; }
  #wrapper .breadcrumb li:last-child { max-width:220px; }
  .page-header h1 { font-size:1.7rem; }
  #ro-toast-stack { left:12px; right:12px; bottom:12px; }
  .ro-toast { min-width:0; max-width:none; width:100%; }
}
/* neutralizza il separatore breadcrumb del tema Classic: il separatore Premium è ::before */
#wrapper .breadcrumb li::after { content: none !important; margin: 0 !important; }

/* =========================================================
   Royal Office Premium 3.0.1 — viewport / overflow hardening
   ========================================================= */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

main,
#wrapper,
#content-wrapper,
#footer,
#header {
  max-width: 100%;
}

img,
svg,
video,
iframe {
  max-width: 100%;
}