/* Styles for the IFSC lookup module.
 *
 * Split out of the shared public/assets/css/pin-swift-ifsc.css, which three
 * modules declared. Its selectors were already per-module
 * (`.pin-details, .swift-details, .ifsc-details`), so the split is mechanical —
 * each module keeps its own third and nothing is shared by file any more.
 *
 * That file also declared several of these rules TWICE: a legacy half using
 * hardcoded hex (#6B7280, #111827, rgba(0,0,0,.1)) and a later token-based half
 * that overrode it on source order. The token values are the ones that
 * rendered, so those are the values kept here; the hex half is gone.
 *
 * Generic pieces (.converter-form, .copy-button, the denser form controls,
 * .mt-4, .text-sm) are core components — all three modules needed them, which
 * is the definition of core's job.
 */

.ifsc-search-form {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

/* One field per row at every width. These selects carry long values (bank,
   branch and post-office names); side-by-side columns clipped them, and a
   closed native <select> cannot be ellipsised reliably, so the only real fix
   is giving each control the form's full width. */
.ifsc-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

/* Semantic <dl> fact list. margin: 0 neutralises the browser-default <dl>/<dd>
   margins so the flex layout matches the div/span markup it replaced. */
.ifsc-details {
    text-align: left;
    background: white;
    border-radius: 0.5rem;
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
    margin: 0;
}

.ifsc-info-row {
    display: flex;
    align-items: flex-start;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--gray-200);
}

.ifsc-info-row:last-child {
    border-bottom: none;
}

.ifsc-label {
    font-weight: 500;
    color: var(--gray-700);
    width: 120px;
    flex-shrink: 0;
    margin: 0;
}

.ifsc-value {
    flex: 1;
    color: var(--gray-900);
    margin: 0;
}

.ifsc-code-container {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 0;
}

.ifsc-code {
    font-family: monospace;
    font-size: 1.125rem;
    color: var(--primary);
    font-weight: 600;
}

@media (max-width: 768px) {
    .ifsc-info-row {
        flex-direction: column;
        gap: 0.25rem;
    }

    .ifsc-label {
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .ifsc-code-container {
        margin-top: 0.5rem;
    }
}

/* ==== shared-lookup-component:begin ==================================
   The lookup form panel + copy button, emitted by THIS module's pages.
   ifsc, pin and swift each keep an identical copy of this block (the
   one rule: siblings that share a thing each own a copy; a test
   compares the three marker-to-marker and fails on drift). The
   .form-control/.form-group overrides are scoped to .converter-form
   so they cannot reach any other family's forms.
   ==================================================================== */
/* --- Lookup form panel -------------------------------------------
   The bordered card the code-lookup tools put their search form in, and the
   denser controls that go inside it. Core's, because all three lookup modules
   need it — the definition of a shared component.

   The .form-control / .form-group overrides are SCOPED to .converter-form on
   purpose. Core's base values are what calculators and currency use; the lookup
   family wants roomier controls (0.75rem padding vs 0.5rem, 1rem type vs
   0.875rem). Declaring them bare — which is how they reached the page when this
   lived in a module sheet — meant the override applied to whichever pages
   happened to load that stylesheet, and could have leaked further. Scoping
   reproduces today's cascade exactly and makes the leak impossible. */
.converter-form {
    background: white;
    padding: 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    max-width: 800px;
    margin: 0 auto;
    text-align: left;
}

.converter-form .form-control {
    padding: 0.75rem;
    border-radius: 0.5rem;
    font-size: 1rem;
    color: var(--gray-900);
    background-color: white;
}

.converter-form .form-group {
    flex: 1;
}

.converter-form .form-group label {
    margin-bottom: 0.5rem;
}

/* --- Copy-to-clipboard button ------------------------------------
   Generic control, no domain meaning. Used by every lookup tool. */
.copy-button {
    background: var(--primary);
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.2s;
}

.copy-button:hover {
    background: var(--primary-dark);
}

.copy-button:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
@media (max-width: 768px) {
    .converter-form {
        padding: 1rem;
    }
}
/* ==== shared-lookup-component:end ==================================== */